@siemens/ix 2.0.3 → 2.0.4-beta.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/base-button.js +1 -1
- package/components/base-button.js.map +1 -1
- package/components/breadcrumb-item.js +1 -1
- package/components/breadcrumb-item.js.map +1 -1
- package/components/button.js +1 -1
- package/components/button.js.map +1 -1
- package/components/dropdown.js +53 -2
- 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/icon-button.js +1 -1
- package/components/icon-button.js.map +1 -1
- package/components/ix-blind.js +9 -14
- package/components/ix-blind.js.map +1 -1
- package/components/ix-category-filter.js +1 -1
- package/components/ix-category-filter.js.map +1 -1
- package/components/ix-dropdown-button.js +1 -1
- package/components/ix-dropdown-button.js.map +1 -1
- package/components/ix-dropdown-quick-actions.js +1 -1
- package/components/ix-dropdown-quick-actions.js.map +1 -1
- package/components/ix-event-list-item.js +1 -1
- package/components/ix-event-list-item.js.map +1 -1
- package/components/ix-expanding-search.js +1 -1
- package/components/ix-expanding-search.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 +1 -1
- package/components/ix-group.js.map +1 -1
- package/components/ix-icon-toggle-button.js +1 -1
- package/components/ix-icon-toggle-button.js.map +1 -1
- package/components/ix-input-group.js +7 -4
- package/components/ix-input-group.js.map +1 -1
- package/components/ix-kpi.js +1 -1
- package/components/ix-kpi.js.map +1 -1
- package/components/ix-map-navigation.js +1 -1
- package/components/ix-map-navigation.js.map +1 -1
- package/components/ix-menu.js +1 -1
- package/components/ix-menu.js.map +1 -1
- package/components/ix-modal-header.js +7 -5
- package/components/ix-modal-header.js.map +1 -1
- package/components/ix-modal.js +6 -3
- package/components/ix-modal.js.map +1 -1
- package/components/ix-pagination.js +1 -1
- package/components/ix-pagination.js.map +1 -1
- package/components/ix-row.js +1 -1
- package/components/ix-row.js.map +1 -1
- package/components/ix-slider.js +26 -4
- package/components/ix-slider.js.map +1 -1
- package/components/ix-tile.js +1 -1
- package/components/ix-tile.js.map +1 -1
- package/components/ix-toast-container.js +1 -1
- package/components/ix-toast-container.js.map +1 -1
- package/components/ix-tree.js +3 -2
- package/components/ix-tree.js.map +1 -1
- package/components/ix-upload.js +1 -1
- package/components/ix-upload.js.map +1 -1
- package/components/listener.js +69 -0
- package/components/listener.js.map +1 -0
- package/components/map-navigation-overlay.js +1 -1
- package/components/map-navigation-overlay.js.map +1 -1
- package/components/menu-service.js +7 -2
- package/components/menu-service.js.map +1 -1
- package/components/select.js +31 -5
- package/components/select.js.map +1 -1
- package/components/tabs.js +44 -12
- package/components/tabs.js.map +1 -1
- package/components/time-picker.js +1 -1
- package/components/time-picker.js.map +1 -1
- package/components/typography.js +1 -1
- package/components/typography.js.map +1 -1
- package/dist/cjs/{base-button-c158438e.js → base-button-7af4dae7.js} +2 -2
- package/dist/cjs/base-button-7af4dae7.js.map +1 -0
- package/dist/cjs/{base-icon-button-bbca2582.js → base-icon-button-d085fd45.js} +2 -2
- package/dist/cjs/{base-icon-button-bbca2582.js.map → base-icon-button-d085fd45.js.map} +1 -1
- package/dist/cjs/ix-application-header.cjs.entry.js +1 -1
- package/dist/cjs/ix-application.cjs.entry.js +1 -1
- package/dist/cjs/ix-basic-navigation.cjs.entry.js +1 -1
- package/dist/cjs/ix-blind.cjs.entry.js +8 -13
- package/dist/cjs/ix-blind.cjs.entry.js.map +1 -1
- package/dist/cjs/ix-breadcrumb-item.cjs.entry.js +2 -2
- package/dist/cjs/ix-breadcrumb-item.cjs.entry.js.map +1 -1
- package/dist/cjs/ix-burger-menu.cjs.entry.js +1 -1
- package/dist/cjs/ix-button.cjs.entry.js +2 -2
- package/dist/cjs/ix-button.cjs.entry.js.map +1 -1
- package/dist/cjs/ix-category-filter.cjs.entry.js +2 -2
- package/dist/cjs/ix-category-filter.cjs.entry.js.map +1 -1
- package/dist/cjs/ix-date-picker_2.cjs.entry.js +1 -1
- package/dist/cjs/ix-date-picker_2.cjs.entry.js.map +1 -1
- package/dist/cjs/ix-dropdown-button.cjs.entry.js +1 -1
- package/dist/cjs/ix-dropdown-button.cjs.entry.js.map +1 -1
- package/dist/cjs/ix-dropdown-quick-actions.cjs.entry.js +1 -1
- package/dist/cjs/ix-dropdown-quick-actions.cjs.entry.js.map +1 -1
- package/dist/cjs/ix-dropdown.cjs.entry.js +52 -1
- package/dist/cjs/ix-dropdown.cjs.entry.js.map +1 -1
- package/dist/cjs/ix-event-list-item.cjs.entry.js +1 -1
- package/dist/cjs/ix-event-list-item.cjs.entry.js.map +1 -1
- package/dist/cjs/ix-expanding-search.cjs.entry.js +1 -1
- package/dist/cjs/ix-expanding-search.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 +1 -1
- package/dist/cjs/ix-group-context-menu_2.cjs.entry.js.map +1 -1
- package/dist/cjs/ix-group.cjs.entry.js +1 -1
- package/dist/cjs/ix-group.cjs.entry.js.map +1 -1
- package/dist/cjs/ix-icon-button_2.cjs.entry.js +3 -3
- package/dist/cjs/ix-icon-button_2.cjs.entry.js.map +1 -1
- package/dist/cjs/ix-icon-toggle-button.cjs.entry.js +3 -3
- package/dist/cjs/ix-icon-toggle-button.cjs.entry.js.map +1 -1
- package/dist/cjs/ix-input-group.cjs.entry.js +7 -4
- package/dist/cjs/ix-input-group.cjs.entry.js.map +1 -1
- package/dist/cjs/ix-kpi.cjs.entry.js +1 -1
- package/dist/cjs/ix-kpi.cjs.entry.js.map +1 -1
- package/dist/cjs/ix-map-navigation-overlay.cjs.entry.js +1 -1
- package/dist/cjs/ix-map-navigation-overlay.cjs.entry.js.map +1 -1
- package/dist/cjs/ix-map-navigation.cjs.entry.js +1 -1
- package/dist/cjs/ix-map-navigation.cjs.entry.js.map +1 -1
- package/dist/cjs/ix-menu.cjs.entry.js +2 -2
- package/dist/cjs/ix-menu.cjs.entry.js.map +1 -1
- package/dist/cjs/ix-modal-header.cjs.entry.js +7 -5
- package/dist/cjs/ix-modal-header.cjs.entry.js.map +1 -1
- package/dist/cjs/ix-modal.cjs.entry.js +6 -3
- package/dist/cjs/ix-modal.cjs.entry.js.map +1 -1
- package/dist/cjs/ix-pagination.cjs.entry.js +2 -2
- package/dist/cjs/ix-pagination.cjs.entry.js.map +1 -1
- package/dist/cjs/ix-row.cjs.entry.js +1 -1
- package/dist/cjs/ix-row.cjs.entry.js.map +1 -1
- package/dist/cjs/ix-select.cjs.entry.js +30 -4
- package/dist/cjs/ix-select.cjs.entry.js.map +1 -1
- package/dist/cjs/ix-slider.cjs.entry.js +25 -3
- package/dist/cjs/ix-slider.cjs.entry.js.map +1 -1
- package/dist/cjs/ix-tab-item_2.cjs.entry.js +44 -10
- package/dist/cjs/ix-tab-item_2.cjs.entry.js.map +1 -1
- package/dist/cjs/ix-tile.cjs.entry.js +1 -1
- package/dist/cjs/ix-tile.cjs.entry.js.map +1 -1
- package/dist/cjs/ix-toast-container.cjs.entry.js +1 -1
- package/dist/cjs/ix-toast-container.cjs.entry.js.map +1 -1
- package/dist/cjs/ix-toggle-button.cjs.entry.js +1 -1
- package/dist/cjs/ix-tree.cjs.entry.js +3 -2
- package/dist/cjs/ix-tree.cjs.entry.js.map +1 -1
- package/dist/cjs/ix-typography.cjs.entry.js +1 -1
- package/dist/cjs/ix-typography.cjs.entry.js.map +1 -1
- package/dist/cjs/ix-upload.cjs.entry.js +1 -1
- package/dist/cjs/ix-upload.cjs.entry.js.map +1 -1
- package/dist/cjs/listener-0cce68b2.js +71 -0
- package/dist/cjs/listener-0cce68b2.js.map +1 -0
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/{menu-service-000df68d.js → menu-service-777bf5ce.js} +8 -3
- package/dist/cjs/menu-service-777bf5ce.js.map +1 -0
- package/dist/cjs/siemens-ix.cjs.js +1 -1
- package/dist/collection/components/blind/blind.css +151 -70
- package/dist/collection/components/blind/blind.js +8 -13
- package/dist/collection/components/blind/blind.js.map +1 -1
- package/dist/collection/components/blind/test/blind.ct.js +16 -0
- package/dist/collection/components/blind/test/blind.ct.js.map +1 -0
- package/dist/collection/components/breadcrumb-item/breadcrumb-item.css +6 -0
- package/dist/collection/components/button/base-button.js +1 -1
- package/dist/collection/components/button/base-button.js.map +1 -1
- package/dist/collection/components/button/button.css +3 -0
- package/dist/collection/components/button/test/button.ct.js +1 -1
- package/dist/collection/components/button/test/button.ct.js.map +1 -1
- package/dist/collection/components/category-filter/category-filter.css +24 -35
- package/dist/collection/components/dropdown/dropdown.js +44 -16
- package/dist/collection/components/dropdown/dropdown.js.map +1 -1
- package/dist/collection/components/dropdown-button/dropdown-button.css +2 -4
- package/dist/collection/components/dropdown-quick-actions/dropdown-quick-actions.css +4 -8
- package/dist/collection/components/event-list-item/event-list-item.css +1 -0
- package/dist/collection/components/expanding-search/expanding-search.css +10 -31
- package/dist/collection/components/form-field/form-field.css +7 -0
- package/dist/collection/components/group/group-context-menu.css +3 -6
- package/dist/collection/components/group/group.css +1 -2
- package/dist/collection/components/icon-button/icon-button.css +3 -0
- package/dist/collection/components/icon-toggle-button/icon-toggle-button.css +3 -0
- package/dist/collection/components/input-group/input-group.js +7 -4
- package/dist/collection/components/input-group/input-group.js.map +1 -1
- package/dist/collection/components/input-group/tests/input-group.ct.js +66 -0
- package/dist/collection/components/input-group/tests/input-group.ct.js.map +1 -1
- package/dist/collection/components/kpi/kpi.css +4 -8
- package/dist/collection/components/map-navigation/map-navigation.css +1 -2
- package/dist/collection/components/map-navigation-overlay/map-navigation-overlay.css +4 -8
- package/dist/collection/components/menu/menu.css +1 -7
- package/dist/collection/components/modal/modal.js +6 -3
- package/dist/collection/components/modal/modal.js.map +1 -1
- package/dist/collection/components/modal-header/modal-header.js +7 -5
- package/dist/collection/components/modal-header/modal-header.js.map +1 -1
- package/dist/collection/components/pagination/pagination.css +16 -37
- package/dist/collection/components/pagination/test/pagination.ct.js +1 -1
- package/dist/collection/components/pagination/test/pagination.ct.js.map +1 -1
- package/dist/collection/components/row/row.css +1 -2
- package/dist/collection/components/select/select.js +22 -10
- package/dist/collection/components/select/select.js.map +1 -1
- package/dist/collection/components/select/test/select.ct.js +19 -0
- package/dist/collection/components/select/test/select.ct.js.map +1 -1
- package/dist/collection/components/slider/slider.js +15 -10
- package/dist/collection/components/slider/slider.js.map +1 -1
- package/dist/collection/components/tabs/tabs.js +21 -12
- package/dist/collection/components/tabs/tabs.js.map +1 -1
- package/dist/collection/components/tile/tile.css +2 -4
- package/dist/collection/components/time-picker/time-picker.css +17 -30
- package/dist/collection/components/toast/styles/toast-container.css +1 -2
- package/dist/collection/components/tooltip/test/tooltip.ct.js +22 -0
- package/dist/collection/components/tooltip/test/tooltip.ct.js.map +1 -0
- package/dist/collection/components/tree/tree.js +3 -2
- package/dist/collection/components/tree/tree.js.map +1 -1
- package/dist/collection/components/typography/typography.css +1 -1
- package/dist/collection/components/upload/upload.css +4 -8
- package/dist/collection/components/utils/application-layout/service.js +7 -2
- package/dist/collection/components/utils/application-layout/service.js.map +1 -1
- package/dist/collection/components/utils/listener.js +65 -0
- package/dist/collection/components/utils/listener.js.map +1 -0
- package/dist/collection/components/utils/requestAnimationFrame.js +24 -0
- package/dist/collection/components/utils/requestAnimationFrame.js.map +1 -0
- package/dist/esm/{base-button-87048318.js → base-button-a4078c61.js} +2 -2
- package/dist/esm/base-button-a4078c61.js.map +1 -0
- package/dist/esm/{base-icon-button-afac2d95.js → base-icon-button-a3dc30a2.js} +2 -2
- package/dist/esm/{base-icon-button-afac2d95.js.map → base-icon-button-a3dc30a2.js.map} +1 -1
- package/dist/esm/ix-application-header.entry.js +1 -1
- package/dist/esm/ix-application.entry.js +1 -1
- package/dist/esm/ix-basic-navigation.entry.js +1 -1
- package/dist/esm/ix-blind.entry.js +9 -14
- package/dist/esm/ix-blind.entry.js.map +1 -1
- package/dist/esm/ix-breadcrumb-item.entry.js +2 -2
- package/dist/esm/ix-breadcrumb-item.entry.js.map +1 -1
- package/dist/esm/ix-burger-menu.entry.js +1 -1
- package/dist/esm/ix-button.entry.js +2 -2
- package/dist/esm/ix-button.entry.js.map +1 -1
- package/dist/esm/ix-category-filter.entry.js +2 -2
- package/dist/esm/ix-category-filter.entry.js.map +1 -1
- package/dist/esm/ix-date-picker_2.entry.js +1 -1
- package/dist/esm/ix-date-picker_2.entry.js.map +1 -1
- package/dist/esm/ix-dropdown-button.entry.js +1 -1
- package/dist/esm/ix-dropdown-button.entry.js.map +1 -1
- package/dist/esm/ix-dropdown-quick-actions.entry.js +1 -1
- package/dist/esm/ix-dropdown-quick-actions.entry.js.map +1 -1
- package/dist/esm/ix-dropdown.entry.js +52 -1
- package/dist/esm/ix-dropdown.entry.js.map +1 -1
- package/dist/esm/ix-event-list-item.entry.js +1 -1
- package/dist/esm/ix-event-list-item.entry.js.map +1 -1
- package/dist/esm/ix-expanding-search.entry.js +1 -1
- package/dist/esm/ix-expanding-search.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 +1 -1
- package/dist/esm/ix-group-context-menu_2.entry.js.map +1 -1
- package/dist/esm/ix-group.entry.js +1 -1
- package/dist/esm/ix-group.entry.js.map +1 -1
- package/dist/esm/ix-icon-button_2.entry.js +3 -3
- package/dist/esm/ix-icon-button_2.entry.js.map +1 -1
- package/dist/esm/ix-icon-toggle-button.entry.js +3 -3
- package/dist/esm/ix-icon-toggle-button.entry.js.map +1 -1
- package/dist/esm/ix-input-group.entry.js +7 -4
- package/dist/esm/ix-input-group.entry.js.map +1 -1
- package/dist/esm/ix-kpi.entry.js +1 -1
- package/dist/esm/ix-kpi.entry.js.map +1 -1
- package/dist/esm/ix-map-navigation-overlay.entry.js +1 -1
- package/dist/esm/ix-map-navigation-overlay.entry.js.map +1 -1
- package/dist/esm/ix-map-navigation.entry.js +1 -1
- package/dist/esm/ix-map-navigation.entry.js.map +1 -1
- package/dist/esm/ix-menu.entry.js +2 -2
- package/dist/esm/ix-menu.entry.js.map +1 -1
- package/dist/esm/ix-modal-header.entry.js +7 -5
- package/dist/esm/ix-modal-header.entry.js.map +1 -1
- package/dist/esm/ix-modal.entry.js +6 -3
- package/dist/esm/ix-modal.entry.js.map +1 -1
- package/dist/esm/ix-pagination.entry.js +2 -2
- package/dist/esm/ix-pagination.entry.js.map +1 -1
- package/dist/esm/ix-row.entry.js +1 -1
- package/dist/esm/ix-row.entry.js.map +1 -1
- package/dist/esm/ix-select.entry.js +30 -4
- package/dist/esm/ix-select.entry.js.map +1 -1
- package/dist/esm/ix-slider.entry.js +25 -3
- package/dist/esm/ix-slider.entry.js.map +1 -1
- package/dist/esm/ix-tab-item_2.entry.js +44 -10
- package/dist/esm/ix-tab-item_2.entry.js.map +1 -1
- package/dist/esm/ix-tile.entry.js +1 -1
- package/dist/esm/ix-tile.entry.js.map +1 -1
- package/dist/esm/ix-toast-container.entry.js +1 -1
- package/dist/esm/ix-toast-container.entry.js.map +1 -1
- package/dist/esm/ix-toggle-button.entry.js +1 -1
- package/dist/esm/ix-tree.entry.js +3 -2
- package/dist/esm/ix-tree.entry.js.map +1 -1
- package/dist/esm/ix-typography.entry.js +1 -1
- package/dist/esm/ix-typography.entry.js.map +1 -1
- package/dist/esm/ix-upload.entry.js +1 -1
- package/dist/esm/ix-upload.entry.js.map +1 -1
- package/dist/esm/listener-3ed639e6.js +69 -0
- package/dist/esm/listener-3ed639e6.js.map +1 -0
- package/dist/esm/loader.js +1 -1
- package/dist/esm/{menu-service-5555b4fa.js → menu-service-04c1257c.js} +8 -3
- package/dist/esm/menu-service-04c1257c.js.map +1 -0
- package/dist/esm/siemens-ix.js +1 -1
- package/dist/siemens-ix/{p-aef14f96.entry.js → p-08420b3b.entry.js} +2 -2
- package/dist/siemens-ix/{p-aef14f96.entry.js.map → p-08420b3b.entry.js.map} +1 -1
- package/dist/siemens-ix/p-222b1672.entry.js +2 -0
- package/dist/siemens-ix/p-222b1672.entry.js.map +1 -0
- package/dist/siemens-ix/p-28633ffb.entry.js +2 -0
- package/dist/siemens-ix/{p-b803c716.entry.js.map → p-28633ffb.entry.js.map} +1 -1
- package/dist/siemens-ix/p-2ff2382a.entry.js +2 -0
- package/dist/siemens-ix/{p-737fca1b.entry.js.map → p-2ff2382a.entry.js.map} +1 -1
- package/dist/siemens-ix/p-3733b547.entry.js +2 -0
- package/dist/siemens-ix/{p-655d177c.entry.js.map → p-3733b547.entry.js.map} +1 -1
- package/dist/siemens-ix/{p-fa7f3eef.entry.js → p-37e0706d.entry.js} +2 -2
- package/dist/siemens-ix/{p-fa7f3eef.entry.js.map → p-37e0706d.entry.js.map} +1 -1
- package/dist/siemens-ix/p-39a2bd9d.entry.js +2 -0
- package/dist/siemens-ix/p-39a2bd9d.entry.js.map +1 -0
- package/dist/siemens-ix/p-51853519.entry.js +2 -0
- package/dist/siemens-ix/{p-302cd093.entry.js.map → p-51853519.entry.js.map} +1 -1
- package/dist/siemens-ix/{p-ad94f795.entry.js → p-556c4b0c.entry.js} +2 -2
- package/dist/siemens-ix/p-556c4b0c.entry.js.map +1 -0
- package/dist/siemens-ix/{p-f97f2394.entry.js → p-58fe5c24.entry.js} +2 -2
- package/dist/siemens-ix/p-5a0d7f95.entry.js +2 -0
- package/dist/siemens-ix/{p-355f9085.entry.js.map → p-5a0d7f95.entry.js.map} +1 -1
- package/dist/siemens-ix/p-5d907f16.entry.js +2 -0
- package/dist/siemens-ix/{p-b6d40648.entry.js.map → p-5d907f16.entry.js.map} +1 -1
- package/dist/siemens-ix/p-616b1eba.entry.js +2 -0
- package/dist/siemens-ix/{p-634da7f2.entry.js.map → p-616b1eba.entry.js.map} +1 -1
- package/dist/siemens-ix/p-68809439.entry.js +2 -0
- package/dist/siemens-ix/{p-9e0af149.entry.js.map → p-68809439.entry.js.map} +1 -1
- package/dist/siemens-ix/p-68b2dcca.entry.js +2 -0
- package/dist/siemens-ix/p-68b2dcca.entry.js.map +1 -0
- package/dist/siemens-ix/p-70bfeb3d.entry.js +2 -0
- package/dist/siemens-ix/{p-9249df8d.entry.js.map → p-70bfeb3d.entry.js.map} +1 -1
- package/dist/siemens-ix/p-79405d11.entry.js +2 -0
- package/dist/siemens-ix/{p-59dc0873.entry.js.map → p-79405d11.entry.js.map} +1 -1
- package/dist/siemens-ix/{p-ab452b82.js → p-7c5fc1c9.js} +2 -2
- package/dist/siemens-ix/{p-ab452b82.js.map → p-7c5fc1c9.js.map} +1 -1
- package/dist/siemens-ix/{p-5516480a.entry.js → p-8968a070.entry.js} +2 -2
- package/dist/siemens-ix/{p-5516480a.entry.js.map → p-8968a070.entry.js.map} +1 -1
- package/dist/siemens-ix/p-8b0793be.js +2 -0
- package/dist/siemens-ix/p-8b0fa98a.entry.js +2 -0
- package/dist/siemens-ix/{p-32265ee2.entry.js.map → p-8b0fa98a.entry.js.map} +1 -1
- package/dist/siemens-ix/p-8ba5f3c5.entry.js +2 -0
- package/dist/siemens-ix/p-8ba5f3c5.entry.js.map +1 -0
- package/dist/siemens-ix/{p-d7e974a8.entry.js → p-939376fb.entry.js} +2 -2
- package/dist/siemens-ix/p-939376fb.entry.js.map +1 -0
- package/dist/siemens-ix/p-9594dcfb.entry.js +2 -0
- package/dist/siemens-ix/{p-9848e4de.entry.js.map → p-9594dcfb.entry.js.map} +1 -1
- package/dist/siemens-ix/p-9dda017b.entry.js +2 -0
- package/dist/siemens-ix/p-9dda017b.entry.js.map +1 -0
- package/dist/siemens-ix/{p-b2042a15.entry.js → p-a00079d9.entry.js} +2 -2
- package/dist/siemens-ix/p-a00079d9.entry.js.map +1 -0
- package/dist/siemens-ix/p-aa89afe7.entry.js +2 -0
- package/dist/siemens-ix/{p-5a5e155c.entry.js.map → p-aa89afe7.entry.js.map} +1 -1
- package/dist/siemens-ix/{p-847da072.entry.js → p-aaef1367.entry.js} +2 -2
- package/dist/siemens-ix/{p-847da072.entry.js.map → p-aaef1367.entry.js.map} +1 -1
- package/dist/siemens-ix/p-b59e7155.js +2 -0
- package/dist/siemens-ix/p-b59e7155.js.map +1 -0
- package/dist/siemens-ix/p-bdc0c1f8.entry.js +2 -0
- package/dist/siemens-ix/{p-b735ee5e.entry.js.map → p-bdc0c1f8.entry.js.map} +1 -1
- package/dist/siemens-ix/p-c996a0ba.entry.js +2 -0
- package/dist/siemens-ix/p-c996a0ba.entry.js.map +1 -0
- package/dist/siemens-ix/p-ccf212e4.entry.js +2 -0
- package/dist/siemens-ix/{p-4968df15.entry.js.map → p-ccf212e4.entry.js.map} +1 -1
- package/dist/siemens-ix/p-cd8c86e2.entry.js +2 -0
- package/dist/siemens-ix/{p-da133606.entry.js.map → p-cd8c86e2.entry.js.map} +1 -1
- package/dist/siemens-ix/p-ce050115.entry.js +2 -0
- package/dist/siemens-ix/{p-167c037c.entry.js.map → p-ce050115.entry.js.map} +1 -1
- package/dist/siemens-ix/p-ceeefa96.entry.js +2 -0
- package/dist/siemens-ix/{p-dcb957d8.entry.js.map → p-ceeefa96.entry.js.map} +1 -1
- package/dist/siemens-ix/p-d0630de9.entry.js +2 -0
- package/dist/siemens-ix/p-d0630de9.entry.js.map +1 -0
- package/dist/siemens-ix/{p-042b8889.entry.js → p-d11781e7.entry.js} +2 -2
- package/dist/siemens-ix/{p-574e3cd1.entry.js → p-db7a632e.entry.js} +2 -2
- package/dist/siemens-ix/{p-228c5657.entry.js → p-e483ad44.entry.js} +2 -2
- package/dist/siemens-ix/p-e7406217.entry.js +2 -0
- package/dist/siemens-ix/{p-d29bcf75.entry.js.map → p-e7406217.entry.js.map} +1 -1
- package/dist/siemens-ix/p-f18c11c5.js +2 -0
- package/dist/siemens-ix/p-f18c11c5.js.map +1 -0
- package/dist/siemens-ix/siemens-ix-core.css +1 -1
- package/dist/siemens-ix/siemens-ix.css +26 -48
- 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/blind/test/blind.ct.d.ts +1 -0
- package/dist/types/components/dropdown/dropdown.d.ts +1 -0
- package/dist/types/components/slider/slider.d.ts +1 -1
- package/dist/types/components/tabs/tabs.d.ts +3 -2
- package/dist/types/components/tooltip/test/tooltip.ct.d.ts +1 -0
- package/dist/types/components/utils/listener.d.ts +11 -0
- package/dist/types/components/utils/requestAnimationFrame.d.ts +7 -0
- package/package.json +1 -1
- package/scss/components/form/_input.scss +8 -1
- package/scss/legacy/components/_forms.scss +0 -13
- package/scss/mixins/_fonts.scss +1 -1
- package/dist/cjs/base-button-c158438e.js.map +0 -1
- package/dist/cjs/menu-service-000df68d.js.map +0 -1
- package/dist/esm/base-button-87048318.js.map +0 -1
- package/dist/esm/menu-service-5555b4fa.js.map +0 -1
- package/dist/siemens-ix/p-167c037c.entry.js +0 -2
- package/dist/siemens-ix/p-1b9b19e6.js +0 -2
- package/dist/siemens-ix/p-28d29e36.entry.js +0 -2
- package/dist/siemens-ix/p-28d29e36.entry.js.map +0 -1
- package/dist/siemens-ix/p-302cd093.entry.js +0 -2
- package/dist/siemens-ix/p-32265ee2.entry.js +0 -2
- package/dist/siemens-ix/p-355f9085.entry.js +0 -2
- package/dist/siemens-ix/p-3ab30153.entry.js +0 -2
- package/dist/siemens-ix/p-3ab30153.entry.js.map +0 -1
- package/dist/siemens-ix/p-4968df15.entry.js +0 -2
- package/dist/siemens-ix/p-59dc0873.entry.js +0 -2
- package/dist/siemens-ix/p-5a5e155c.entry.js +0 -2
- package/dist/siemens-ix/p-5d172daa.js +0 -2
- package/dist/siemens-ix/p-5d172daa.js.map +0 -1
- package/dist/siemens-ix/p-634da7f2.entry.js +0 -2
- package/dist/siemens-ix/p-655d177c.entry.js +0 -2
- package/dist/siemens-ix/p-737fca1b.entry.js +0 -2
- package/dist/siemens-ix/p-9249df8d.entry.js +0 -2
- package/dist/siemens-ix/p-9848e4de.entry.js +0 -2
- package/dist/siemens-ix/p-9e0af149.entry.js +0 -2
- package/dist/siemens-ix/p-ad94f795.entry.js.map +0 -1
- package/dist/siemens-ix/p-b2042a15.entry.js.map +0 -1
- package/dist/siemens-ix/p-b6d40648.entry.js +0 -2
- package/dist/siemens-ix/p-b735ee5e.entry.js +0 -2
- package/dist/siemens-ix/p-b803c716.entry.js +0 -2
- package/dist/siemens-ix/p-bd873b87.entry.js +0 -2
- package/dist/siemens-ix/p-bd873b87.entry.js.map +0 -1
- package/dist/siemens-ix/p-c1318e16.entry.js +0 -2
- package/dist/siemens-ix/p-c1318e16.entry.js.map +0 -1
- package/dist/siemens-ix/p-d16a4670.entry.js +0 -2
- package/dist/siemens-ix/p-d16a4670.entry.js.map +0 -1
- package/dist/siemens-ix/p-d214f57a.entry.js +0 -2
- package/dist/siemens-ix/p-d214f57a.entry.js.map +0 -1
- package/dist/siemens-ix/p-d29bcf75.entry.js +0 -2
- package/dist/siemens-ix/p-d7e974a8.entry.js.map +0 -1
- package/dist/siemens-ix/p-da133606.entry.js +0 -2
- package/dist/siemens-ix/p-dcb957d8.entry.js +0 -2
- package/dist/siemens-ix/p-fd6006d2.entry.js +0 -2
- package/dist/siemens-ix/p-fd6006d2.entry.js.map +0 -1
- /package/dist/siemens-ix/{p-f97f2394.entry.js.map → p-58fe5c24.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-1b9b19e6.js.map → p-8b0793be.js.map} +0 -0
- /package/dist/siemens-ix/{p-042b8889.entry.js.map → p-d11781e7.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-574e3cd1.entry.js.map → p-db7a632e.entry.js.map} +0 -0
- /package/dist/siemens-ix/{p-228c5657.entry.js.map → p-e483ad44.entry.js.map} +0 -0
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{r as o,c as e,h as r,H as t,g as n}from"./p-76a509c7.js";import{B as i}from"./p-7c5fc1c9.js";import{a}from"./p-2fd30d79.js";const l=".form-control,.form-control-plaintext{-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);color:var(--theme-input--color);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-radius:var(--theme-input--border-radius);height:2rem;min-height:2rem;min-width:2rem;background-color:var(--theme-input--background);border:solid 1px var(--theme-input--border-color);box-shadow:var(--theme-input--box-shadow);padding-inline-start:0.5rem;padding-inline-end:0.5rem}.form-control::-moz-placeholder,.form-control-plaintext::-moz-placeholder{color:var(--theme-input-hint--color)}.form-control::placeholder,.form-control-plaintext::placeholder{color:var(--theme-input-hint--color)}.form-control:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled),.form-control-plaintext:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled){cursor:pointer}.form-control:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled),.form-control-plaintext:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled){cursor:pointer}.form-control:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):hover,.form-control-plaintext:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):hover{background-color:var(--theme-input--background--hover);border-color:var(--theme-input--border-color--hover);cursor:auto}.form-control:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):hover,.form-control-plaintext:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):hover{background-color:var(--theme-input--background--hover);border-color:var(--theme-input--border-color--hover);cursor:auto}.form-control:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):focus-visible,.form-control-plaintext:not(:-moz-read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):focus-visible{background-color:var(--theme-input--background--focus);border-color:var(--theme-input--border-color--focus);outline-offset:var(--theme-input--focus--outline-offset);box-shadow:var(--theme-input--box-shadow);outline:1px solid var(--theme-color-focus-bdr)}.form-control:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):focus-visible,.form-control-plaintext:not(:read-only):not([readonly]):not([readOnly]):not(.readonly):not(.disabled):not(:disabled):focus-visible{background-color:var(--theme-input--background--focus);border-color:var(--theme-input--border-color--focus);outline-offset:var(--theme-input--focus--outline-offset);box-shadow:var(--theme-input--box-shadow);outline:1px solid var(--theme-color-focus-bdr)}.form-control:focus-visible{color:var(--theme-input--color)}.form-control[type=number]{text-align:right}.form-control[type=number]::-webkit-inner-spin-button{margin-right:-2px;margin-left:2px;display:none}.form-control.readonly,.form-control[readonly]{background:transparent !important;border-block-start:none !important;border-inline-start:none !important;border-inline-end:none !important;border-radius:0rem}.form-control:-moz-read-only{box-shadow:none !important;outline:none !important;border-color:var(--theme-input--border-color);cursor:default !important}.form-control:read-only,.form-control[readonly],.form-control[readOnly],.form-control.readonly{box-shadow:none !important;outline:none !important;border-color:var(--theme-input--border-color);cursor:default !important}.form-control:read-only::-moz-placeholder,.form-control[readonly]::-moz-placeholder,.form-control[readOnly]::-moz-placeholder,.form-control.readonly::-moz-placeholder{color:transparent}.form-control:-moz-read-only::placeholder{color:transparent}.form-control:read-only::placeholder,.form-control[readonly]::placeholder,.form-control[readOnly]::placeholder,.form-control.readonly::placeholder{color:transparent}.form-control:disabled,.form-control.disabled{background:transparent !important;border-block-start:none !important;border-inline-start:none !important;border-inline-end:none !important;border-radius:0rem;color:var(--theme-color-weak-text);border-color:var(--theme-input--border-color-bottom--disabled)}.form-control:disabled::-moz-placeholder,.form-control.disabled::-moz-placeholder{color:transparent}.form-control:disabled::placeholder,.form-control.disabled::placeholder{color:transparent}.form-control-plaintext{outline:0}.form-group{position:relative}.input-wrapper{display:flex;position:relative;align-items:center;flex-wrap:nowrap}.input-wrapper>.glyph{display:block;position:absolute;margin-inline-start:0.312rem;color:var(--theme-color-std-text)}.input-wrapper>input{padding-inline-start:2.2rem}select.form-control{padding:0 0.312rem}textarea.form-control{padding:0.375rem 0.5rem}input.disabled,input:disabled{color:var(--theme-input--color--disabled)}input:-moz-read-only{cursor:default}input:read-only,input.readonly{cursor:default}:host{display:inline-block;height:2rem;vertical-align:middle;cursor:pointer;-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:700;line-height:1.429em;color:var(--theme-color-std-text)}:host *,: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{all:unset;box-sizing:border-box;display:inline-flex;flex-direction:row;flex-wrap:nowrap;overflow:hidden;align-items:center;justify-content:center;width:100%;height:100%;padding:0 0.5rem}:host ix-spinner{margin-right:0.25rem}:host ix-icon{margin-right:0.25rem}:host .content{display:inline-block;position:relative;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host .content-start{width:100%}:host .icon{pointer-events:none}:host(.disabled){cursor:default}*,*::after,*::before{box-sizing:border-box}::-webkit-scrollbar-button{display:none}::-webkit-scrollbar{width:0.5rem;height:0.5rem}::-webkit-scrollbar-track{border-radius:5px;background:var(--theme-scrollbar-track--background)}::-webkit-scrollbar-track:hover{background:var(--theme-scrollbar-track--background--hover)}::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}::-webkit-scrollbar-corner{display:none}:host .btn-primary{border-radius:var(--theme-btn--border-radius)}:host .btn-primary,:host .btn-primary.focus,:host .btn-primary:focus-visible{background-color:var(--theme-btn-primary--background);color:var(--theme-btn-primary--color);--ix-button-color:var(--theme-btn-primary--color);border-width:var(--theme-btn--border-thickness);border-color:var(--theme-btn-primary--border-color);border-style:solid}:host .btn-primary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}:host .btn-primary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}:host .btn-primary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-primary.selected:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}:host .btn-primary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-primary.selected:not(.disabled):not(:disabled):active,:host .btn-primary.selected:not(.disabled):not(:disabled).active{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}:host .btn-primary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-primary:not(.disabled):not(:disabled):hover{border-color:var(--theme-btn-primary--border-color--hover);background-color:var(--theme-btn-primary--background--hover);color:var(--theme-btn-primary--color--hover)}:host .btn-primary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-primary:not(.disabled):not(:disabled):active,:host .btn-primary:not(.disabled):not(:disabled).active{border-color:var(--theme-btn-primary--border-color--active);background-color:var(--theme-btn-primary--background--active);color:var(--theme-btn-primary--color--active)}:host(.disabled){pointer-events:none}:host(.disabled) .btn-primary.disabled,:host(.disabled) .btn-primary:disabled{pointer-events:none;border-color:var(--theme-btn-primary--border-color--disabled);background-color:var(--theme-btn-primary--background--disabled);color:var(--theme-btn-primary--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-primary--color--disabled)}:host .btn-outline-primary{border-radius:var(--theme-btn--border-radius)}:host .btn-outline-primary,:host .btn-outline-primary.focus,:host .btn-outline-primary:focus-visible{background-color:var(--theme-btn-outline-primary--background);color:var(--theme-btn-outline-primary--color);--ix-button-color:var(--theme-btn-outline-primary--color);border-width:var(--theme-btn--border-thickness);border-color:var(--theme-btn-outline-primary--border-color);border-style:solid}:host .btn-outline-primary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}:host .btn-outline-primary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}:host .btn-outline-primary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-primary.selected:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}:host .btn-outline-primary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-primary.selected:not(.disabled):not(:disabled):active,:host .btn-outline-primary.selected:not(.disabled):not(:disabled).active{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}:host .btn-outline-primary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-primary:not(.disabled):not(:disabled):hover{border-color:var(--theme-btn-outline-primary--border-color--hover);background-color:var(--theme-btn-outline-primary--background--hover);color:var(--theme-btn-outline-primary--color--hover)}:host .btn-outline-primary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-primary:not(.disabled):not(:disabled):active,:host .btn-outline-primary:not(.disabled):not(:disabled).active{border-color:var(--theme-btn-outline-primary--border-color--active);background-color:var(--theme-btn-outline-primary--background--active);color:var(--theme-btn-outline-primary--color--active)}:host(.disabled){pointer-events:none}:host(.disabled) .btn-outline-primary.disabled,:host(.disabled) .btn-outline-primary:disabled{pointer-events:none;border-color:var(--theme-btn-outline-primary--border-color--disabled);background-color:var(--theme-btn-outline-primary--background--disabled);color:var(--theme-btn-outline-primary--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-outline-primary--color--disabled)}:host .btn-invisible-primary{border-radius:var(--theme-btn--border-radius)}:host .btn-invisible-primary,:host .btn-invisible-primary.focus,:host .btn-invisible-primary:focus-visible{background-color:var(--theme-btn-invisible-primary--background);color:var(--theme-btn-invisible-primary--color);--ix-button-color:var(--theme-btn-invisible-primary--color);border-color:transparent}:host .btn-invisible-primary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}:host .btn-invisible-primary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}:host .btn-invisible-primary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-primary.selected:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}:host .btn-invisible-primary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-primary.selected:not(.disabled):not(:disabled):active,:host .btn-invisible-primary.selected:not(.disabled):not(:disabled).active{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}:host .btn-invisible-primary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-primary:not(.disabled):not(:disabled):hover{background-color:var(--theme-btn-invisible-primary--background--hover);color:var(--theme-btn-invisible-primary--color--hover)}:host .btn-invisible-primary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-primary:not(.disabled):not(:disabled):active,:host .btn-invisible-primary:not(.disabled):not(:disabled).active{background-color:var(--theme-btn-invisible-primary--background--active);color:var(--theme-btn-invisible-primary--color--active)}:host(.disabled){pointer-events:none}:host(.disabled) .btn-invisible-primary.disabled,:host(.disabled) .btn-invisible-primary:disabled{pointer-events:none;background-color:var(--theme-btn-invisible-primary--background--disabled);color:var(--theme-btn-invisible-primary--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-invisible-primary--color--disabled)}:host .btn-secondary{border-radius:var(--theme-btn--border-radius)}:host .btn-secondary,:host .btn-secondary.focus,:host .btn-secondary:focus-visible{background-color:var(--theme-btn-secondary--background);color:var(--theme-btn-secondary--color);--ix-button-color:var(--theme-btn-secondary--color);border-width:var(--theme-btn--border-thickness);border-color:var(--theme-btn-secondary--border-color);border-style:solid}:host .btn-secondary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}:host .btn-secondary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}:host .btn-secondary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-secondary.selected:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}:host .btn-secondary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-secondary.selected:not(.disabled):not(:disabled):active,:host .btn-secondary.selected:not(.disabled):not(:disabled).active{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}:host .btn-secondary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-secondary:not(.disabled):not(:disabled):hover{border-color:var(--theme-btn-secondary--border-color--hover);background-color:var(--theme-btn-secondary--background--hover);color:var(--theme-btn-secondary--color--hover)}:host .btn-secondary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-secondary:not(.disabled):not(:disabled):active,:host .btn-secondary:not(.disabled):not(:disabled).active{border-color:var(--theme-btn-secondary--border-color--active);background-color:var(--theme-btn-secondary--background--active);color:var(--theme-btn-secondary--color--active)}:host(.disabled){pointer-events:none}:host(.disabled) .btn-secondary.disabled,:host(.disabled) .btn-secondary:disabled{pointer-events:none;border-color:var(--theme-btn-secondary--border-color--disabled);background-color:var(--theme-btn-secondary--background--disabled);color:var(--theme-btn-secondary--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-secondary--color--disabled)}:host .btn-outline-secondary{border-radius:var(--theme-btn--border-radius)}:host .btn-outline-secondary,:host .btn-outline-secondary.focus,:host .btn-outline-secondary:focus-visible{background-color:var(--theme-btn-outline-secondary--background);color:var(--theme-btn-outline-secondary--color);--ix-button-color:var(--theme-btn-outline-secondary--color);border-width:var(--theme-btn--border-thickness);border-color:var(--theme-btn-outline-secondary--border-color);border-style:solid}:host .btn-outline-secondary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}:host .btn-outline-secondary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}:host .btn-outline-secondary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-secondary.selected:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}:host .btn-outline-secondary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-secondary.selected:not(.disabled):not(:disabled):active,:host .btn-outline-secondary.selected:not(.disabled):not(:disabled).active{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}:host .btn-outline-secondary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-secondary:not(.disabled):not(:disabled):hover{border-color:var(--theme-btn-outline-secondary--border-color--hover);background-color:var(--theme-btn-outline-secondary--background--hover);color:var(--theme-btn-outline-secondary--color--hover)}:host .btn-outline-secondary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-outline-secondary:not(.disabled):not(:disabled):active,:host .btn-outline-secondary:not(.disabled):not(:disabled).active{border-color:var(--theme-btn-outline-secondary--border-color--active);background-color:var(--theme-btn-outline-secondary--background--active);color:var(--theme-btn-outline-secondary--color--active)}:host(.disabled){pointer-events:none}:host(.disabled) .btn-outline-secondary.disabled,:host(.disabled) .btn-outline-secondary:disabled{pointer-events:none;border-color:var(--theme-btn-outline-secondary--border-color--disabled);background-color:var(--theme-btn-outline-secondary--background--disabled);color:var(--theme-btn-outline-secondary--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-outline-secondary--color--disabled)}:host .btn-invisible-secondary{border-radius:var(--theme-btn--border-radius)}:host .btn-invisible-secondary,:host .btn-invisible-secondary.focus,:host .btn-invisible-secondary:focus-visible{background-color:var(--theme-btn-invisible-secondary--background);color:var(--theme-btn-invisible-secondary--color);--ix-button-color:var(--theme-btn-invisible-secondary--color);border-color:transparent}:host .btn-invisible-secondary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}:host .btn-invisible-secondary.selected{background-color:var(--theme-color-ghost--selected);color:var(--theme-color-dynamic)}:host .btn-invisible-secondary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-secondary.selected:not(.disabled):not(:disabled):hover{background-color:var(--theme-color-ghost--selected-hover);color:var(--theme-color-dynamic)}:host .btn-invisible-secondary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-secondary.selected:not(.disabled):not(:disabled):active,:host .btn-invisible-secondary.selected:not(.disabled):not(:disabled).active{background-color:var(--theme-color-ghost--selected-active);color:var(--theme-color-dynamic)}:host .btn-invisible-secondary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-secondary:not(.disabled):not(:disabled):hover{background-color:var(--theme-btn-invisible-secondary--background--hover);color:var(--theme-btn-invisible-secondary--color--hover)}:host .btn-invisible-secondary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-invisible-secondary:not(.disabled):not(:disabled):active,:host .btn-invisible-secondary:not(.disabled):not(:disabled).active{background-color:var(--theme-btn-invisible-secondary--background--active);color:var(--theme-btn-invisible-secondary--color--active)}:host(.disabled){pointer-events:none}:host(.disabled) .btn-invisible-secondary.disabled,:host(.disabled) .btn-invisible-secondary:disabled{pointer-events:none;background-color:var(--theme-btn-invisible-secondary--background--disabled);color:var(--theme-btn-invisible-secondary--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-invisible-secondary--color--disabled)}:host{display:inline-flex;justify-content:center;align-items:center}:host button{width:100%;height:100%;overflow:hidden;padding:0}:host button.btn-oval{border-radius:6.25rem}:host ix-icon{color:var(--ix-icon-button-color, currentColor);margin:0}:host ix-spinner{margin:0}:host(.btn-icon-12){height:1rem;width:1rem;min-width:1rem;min-height:1rem}:host(.btn-icon-16){height:1.5rem;width:1.5rem;min-width:1.5rem;min-height:1.5rem}:host(.btn-icon-32){height:2rem;width:2rem;min-width:2rem;min-height:2rem}:host(.btn-icon-12) ix-spinner{height:12px;width:12px}:host(.btn-icon-16) ix-spinner{height:16px;width:16px}:host(.btn-icon-32) ix-spinner{height:24px;width:24px}:host{}: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,:host .advanced-pagination,:host .item-count{display:inline-flex;align-items:center}:host .basic-pagination{padding:0 0.125rem}:host .advanced-pagination{padding:0 0.75rem}:host .page-selection{width:4.125rem;text-align:center;margin:0 0.5rem}:host .page-buttons{white-space:nowrap}:host .total-count{white-space:nowrap}:host .item-count{flex-grow:1;justify-content:flex-end;margin-inline-start:1.5rem}:host .item-count ix-select{width:4.5rem;margin-inline-start:1.5rem}:host button{width:auto;min-width:2rem;height:2rem;padding:0 0.5rem}:host button+button{margin-inline-start:0.125rem}";const s=class{constructor(r){o(this,r);this.pageSelected=e(this,"pageSelected",7);this.itemCountChanged=e(this,"itemCountChanged",7);this.baseButtonConfig={variant:"secondary",outline:false,ghost:true,iconOnly:true,iconOval:false,disabled:false,icon:"",loading:false,selected:false,type:"button",extraClasses:{["w-auto"]:true}};this.maxCountPages=7;this.advanced=undefined;this.itemCount=15;this.showItemCount=true;this.count=undefined;this.selectedPage=0;this.i18nPage="Page";this.i18nOf="of";this.i18nItems="Items"}selectPage(o){if(o<0){this.selectedPage=0}else if(o>this.count-1){this.selectedPage=this.count-1}else{this.selectedPage=o}this.pageSelected.emit(this.selectedPage)}increase(){if(this.selectedPage===this.count-1){return}this.selectPage(this.selectedPage+1)}decrease(){if(this.selectedPage===0){return}this.selectPage(this.selectedPage-1)}getPageButton(o){const e=Object.assign(Object.assign({},this.baseButtonConfig),{onClick:()=>this.selectPage(o),selected:this.selectedPage===o,ariaAttributes:{"aria-pressed":a(this.selectedPage===o)}});return r(i,Object.assign({},e),o+1)}renderPageButtons(){const o=Math.floor(this.maxCountPages/2);const e=this.count>this.maxCountPages;const t=e&&this.selectedPage>o;const n=e&&this.selectedPage<this.count-o-1;const a=[];let l=0;let s=Math.min(this.count,this.maxCountPages);let d=Math.floor((this.maxCountPages-4)/2);if(t){const o=Object.assign(Object.assign({},this.baseButtonConfig),{onClick:()=>{if(n){this.selectPage(this.selectedPage-Math.max(0,2*d+1))}else{this.selectPage(this.count-this.maxCountPages)}}});a.push(this.getPageButton(0));a.push(r(i,Object.assign({},o),"..."));if(n){l=this.count-this.maxCountPages+2}else{l=this.count-this.maxCountPages+2;s=this.count}}if(n){if(t){l=this.selectedPage-d;s=this.selectedPage+d+1}else{s=this.maxCountPages-2}}for(let o=l;o<s;o++){a.push(this.getPageButton(o))}if(n){const o=Object.assign(Object.assign({},this.baseButtonConfig),{onClick:()=>{if(t){this.selectPage(this.selectedPage+Math.max(0,2*d+1))}else{this.selectPage(this.maxCountPages-1)}}});a.push(r(i,Object.assign({},o),"..."));a.push(this.getPageButton(this.count-1))}return r("span",{class:"page-buttons"},a)}render(){return r(t,null,r("ix-icon-button",{disabled:this.selectedPage===0,ghost:true,icon:"chevron-left-small",onClick:()=>this.decrease()}),this.advanced?r("div",{class:"advanced-pagination"},r("ix-typography",{variant:"default"},this.i18nPage),r("input",{class:"form-control page-selection",type:"number",min:"1",max:this.count,value:this.selectedPage+1,onChange:o=>{const e=Number.parseInt(o.target["value"]);this.selectPage(e-1)}}),r("span",{class:"total-count"},r("ix-typography",{variant:"default"},this.i18nOf," ",this.count))):r("span",{class:"basic-pagination"},this.renderPageButtons()," "),r("ix-icon-button",{disabled:this.selectedPage===this.count-1,ghost:true,icon:"chevron-right-small",onClick:()=>this.increase()}),this.advanced&&this.showItemCount?r("span",{class:"item-count"},r("ix-typography",{variant:"default"},this.i18nItems),r("ix-select",{hideListHeader:true,i18nPlaceholder:"",i18nSelectListHeader:"",value:`${this.itemCount}`,onValueChange:o=>{const e=Number.parseInt(Array.isArray(o.detail)?o.detail[0]:o.detail);this.itemCountChanged.emit(e)}},r("ix-select-item",{label:"10",value:"10"}),r("ix-select-item",{label:"15",value:"15"}),r("ix-select-item",{label:"20",value:"20"}),r("ix-select-item",{label:"40",value:"40"}),r("ix-select-item",{label:"100",value:"100"}))):"")}get hostElement(){return n(this)}};s.style=l;export{s as ix_pagination};
|
|
2
|
+
//# sourceMappingURL=p-8b0fa98a.entry.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["paginationCss","Pagination","this","baseButtonConfig","variant","outline","ghost","iconOnly","iconOval","disabled","icon","loading","selected","type","extraClasses","maxCountPages","selectPage","index","selectedPage","count","pageSelected","emit","increase","decrease","getPageButton","baseButtonProps","Object","assign","onClick","ariaAttributes","a11yBoolean","h","BaseButton","renderPageButtons","pagesBeforeOverflow","Math","floor","hasOverflow","hasOverflowStart","hasOverflowEnd","pageButtons","start","end","min","pageCount","max","push","i","class","render","Host","advanced","i18nPage","value","onChange","e","Number","parseInt","target","i18nOf","showItemCount","i18nItems","hideListHeader","i18nPlaceholder","i18nSelectListHeader","itemCount","onValueChange","Array","isArray","detail","itemCountChanged","label"],"sources":["./src/components/pagination/pagination.scss?tag=ix-pagination&encapsulation=shadow","./src/components/pagination/pagination.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2022 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/components/forms';\n@import '../icon-button/icon-button';\n@import 'mixins/shadow-dom/component';\n\n:host {\n @include ix-component;\n\n &,\n .advanced-pagination,\n .item-count {\n display: inline-flex;\n align-items: center;\n }\n\n .basic-pagination {\n padding: 0 0.125rem;\n }\n\n .advanced-pagination {\n padding: 0 $medium-space;\n }\n\n .page-selection {\n width: 4.125rem;\n text-align: center;\n margin: 0 $small-space;\n }\n\n .page-buttons {\n white-space: nowrap;\n }\n\n .total-count {\n white-space: nowrap;\n }\n\n .item-count {\n flex-grow: 1;\n justify-content: flex-end;\n margin-inline-start: $large-space;\n\n ix-select {\n width: 4.5rem;\n margin-inline-start: $large-space;\n }\n }\n\n button {\n width: auto;\n min-width: 2rem;\n height: 2rem;\n padding: 0 0.5rem;\n }\n\n button + button {\n margin-inline-start: 0.125rem;\n }\n}\n","/*\n * SPDX-FileCopyrightText: 2022 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Prop,\n} from '@stencil/core';\nimport { BaseButton, BaseButtonProps } from '../button/base-button';\nimport { a11yBoolean } from '../utils/a11y';\n\n/**\n * @since 1.5.0\n */\n@Component({\n tag: 'ix-pagination',\n styleUrl: 'pagination.scss',\n shadow: true,\n})\nexport class Pagination {\n private readonly baseButtonConfig: BaseButtonProps = {\n variant: 'secondary',\n outline: false,\n ghost: true,\n iconOnly: true,\n iconOval: false,\n disabled: false,\n icon: '',\n loading: false,\n selected: false,\n type: 'button',\n extraClasses: {\n ['w-auto']: true,\n },\n };\n\n private readonly maxCountPages = 7;\n\n @Element() hostElement!: HTMLIxPaginationElement;\n\n /**\n * Advanced mode\n */\n @Prop() advanced: boolean;\n\n /**\n * Number of items shown at once.\n * Can only be changed in advaced mode.\n */\n @Prop() itemCount = 15;\n\n /**\n * Show item count in advanced mode\n */\n @Prop() showItemCount = true;\n\n /**\n * Total number of pages\n */\n @Prop() count: number;\n\n /**\n * Zero based index of currently selected page\n */\n @Prop({ mutable: true }) selectedPage = 0;\n\n /**\n * i18n\n */\n @Prop() i18nPage = 'Page';\n\n /**\n * i18n\n */\n @Prop() i18nOf = 'of';\n\n /**\n /**\n * i18n\n */\n @Prop() i18nItems = 'Items';\n\n /**\n * Page selection event\n */\n @Event() pageSelected: EventEmitter<number>;\n\n /**\n * Item count change event\n */\n @Event() itemCountChanged: EventEmitter<number>;\n\n private selectPage(index: number) {\n if (index < 0) {\n this.selectedPage = 0;\n } else if (index > this.count - 1) {\n this.selectedPage = this.count - 1;\n } else {\n this.selectedPage = index;\n }\n\n this.pageSelected.emit(this.selectedPage);\n }\n\n private increase() {\n if (this.selectedPage === this.count - 1) {\n return;\n }\n\n this.selectPage(this.selectedPage + 1);\n }\n\n private decrease() {\n if (this.selectedPage === 0) {\n return;\n }\n\n this.selectPage(this.selectedPage - 1);\n }\n\n private getPageButton(index: number) {\n const baseButtonProps: BaseButtonProps = {\n ...this.baseButtonConfig,\n onClick: () => this.selectPage(index),\n selected: this.selectedPage === index,\n ariaAttributes: {\n 'aria-pressed': a11yBoolean(this.selectedPage === index),\n },\n };\n\n return <BaseButton {...baseButtonProps}>{index + 1}</BaseButton>;\n }\n\n private renderPageButtons() {\n const pagesBeforeOverflow = Math.floor(this.maxCountPages / 2);\n const hasOverflow = this.count > this.maxCountPages;\n const hasOverflowStart =\n hasOverflow && this.selectedPage > pagesBeforeOverflow;\n const hasOverflowEnd =\n hasOverflow && this.selectedPage < this.count - pagesBeforeOverflow - 1;\n const pageButtons = [];\n\n let start = 0;\n let end = Math.min(this.count, this.maxCountPages);\n let pageCount = Math.floor((this.maxCountPages - 4) / 2);\n\n if (hasOverflowStart) {\n const baseButtonProps = {\n ...this.baseButtonConfig,\n onClick: () => {\n if (hasOverflowEnd) {\n this.selectPage(this.selectedPage - Math.max(0, 2 * pageCount + 1));\n } else {\n this.selectPage(this.count - this.maxCountPages);\n }\n },\n };\n pageButtons.push(this.getPageButton(0));\n pageButtons.push(<BaseButton {...baseButtonProps}>...</BaseButton>);\n\n if (hasOverflowEnd) {\n start = this.count - this.maxCountPages + 2;\n } else {\n start = this.count - this.maxCountPages + 2;\n end = this.count;\n }\n }\n\n if (hasOverflowEnd) {\n if (hasOverflowStart) {\n start = this.selectedPage - pageCount;\n end = this.selectedPage + pageCount + 1;\n } else {\n end = this.maxCountPages - 2;\n }\n }\n\n for (let i = start; i < end; i++) {\n pageButtons.push(this.getPageButton(i));\n }\n\n if (hasOverflowEnd) {\n const baseButtonProps = {\n ...this.baseButtonConfig,\n onClick: () => {\n if (hasOverflowStart) {\n this.selectPage(this.selectedPage + Math.max(0, 2 * pageCount + 1));\n } else {\n this.selectPage(this.maxCountPages - 1);\n }\n },\n };\n pageButtons.push(<BaseButton {...baseButtonProps}>...</BaseButton>);\n pageButtons.push(this.getPageButton(this.count - 1));\n }\n\n return <span class=\"page-buttons\">{pageButtons}</span>;\n }\n\n render() {\n return (\n <Host>\n <ix-icon-button\n disabled={this.selectedPage === 0}\n ghost\n icon={'chevron-left-small'}\n onClick={() => this.decrease()}\n ></ix-icon-button>\n\n {this.advanced ? (\n <div class=\"advanced-pagination\">\n <ix-typography variant=\"default\">{this.i18nPage}</ix-typography>\n <input\n class=\"form-control page-selection\"\n type=\"number\"\n min=\"1\"\n max={this.count}\n value={this.selectedPage + 1}\n onChange={(e) => {\n const index = Number.parseInt(e.target['value']);\n this.selectPage(index - 1);\n }}\n />\n <span class=\"total-count\">\n <ix-typography variant=\"default\">\n {this.i18nOf} {this.count}\n </ix-typography>\n </span>\n </div>\n ) : (\n <span class=\"basic-pagination\">{this.renderPageButtons()} </span>\n )}\n\n <ix-icon-button\n disabled={this.selectedPage === this.count - 1}\n ghost\n icon={'chevron-right-small'}\n onClick={() => this.increase()}\n ></ix-icon-button>\n\n {this.advanced && this.showItemCount ? (\n <span class=\"item-count\">\n <ix-typography variant=\"default\">{this.i18nItems}</ix-typography>\n <ix-select\n hideListHeader\n i18nPlaceholder=\"\"\n i18nSelectListHeader=\"\"\n value={`${this.itemCount}`}\n onValueChange={(e) => {\n const count = Number.parseInt(\n Array.isArray(e.detail) ? e.detail[0] : e.detail\n );\n\n this.itemCountChanged.emit(count);\n }}\n >\n <ix-select-item label=\"10\" value=\"10\"></ix-select-item>\n <ix-select-item label=\"15\" value=\"15\"></ix-select-item>\n <ix-select-item label=\"20\" value=\"20\"></ix-select-item>\n <ix-select-item label=\"40\" value=\"40\"></ix-select-item>\n <ix-select-item label=\"100\" value=\"100\"></ix-select-item>\n </ix-select>\n </span>\n ) : (\n ''\n )}\n </Host>\n );\n }\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"names":["paginationCss","Pagination","this","baseButtonConfig","variant","outline","ghost","iconOnly","iconOval","disabled","icon","loading","selected","type","extraClasses","maxCountPages","selectPage","index","selectedPage","count","pageSelected","emit","increase","decrease","getPageButton","baseButtonProps","Object","assign","onClick","ariaAttributes","a11yBoolean","h","BaseButton","renderPageButtons","pagesBeforeOverflow","Math","floor","hasOverflow","hasOverflowStart","hasOverflowEnd","pageButtons","start","end","min","pageCount","max","push","i","class","render","Host","advanced","i18nPage","value","onChange","e","Number","parseInt","target","i18nOf","showItemCount","i18nItems","hideListHeader","i18nPlaceholder","i18nSelectListHeader","itemCount","onValueChange","Array","isArray","detail","itemCountChanged","label"],"sources":["./src/components/pagination/pagination.scss?tag=ix-pagination&encapsulation=shadow","./src/components/pagination/pagination.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2022 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/components/forms';\n@import '../icon-button/icon-button';\n@import 'mixins/shadow-dom/component';\n\n:host {\n @include ix-component;\n\n &,\n .advanced-pagination,\n .item-count {\n display: inline-flex;\n align-items: center;\n }\n\n .basic-pagination {\n padding: 0 0.125rem;\n }\n\n .advanced-pagination {\n padding: 0 $medium-space;\n }\n\n .page-selection {\n width: 4.125rem;\n text-align: center;\n margin: 0 $small-space;\n }\n\n .page-buttons {\n white-space: nowrap;\n }\n\n .total-count {\n white-space: nowrap;\n }\n\n .item-count {\n flex-grow: 1;\n justify-content: flex-end;\n margin-inline-start: $large-space;\n\n ix-select {\n width: 4.5rem;\n margin-inline-start: $large-space;\n }\n }\n\n button {\n width: auto;\n min-width: 2rem;\n height: 2rem;\n padding: 0 0.5rem;\n }\n\n button + button {\n margin-inline-start: 0.125rem;\n }\n}\n","/*\n * SPDX-FileCopyrightText: 2022 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Prop,\n} from '@stencil/core';\nimport { BaseButton, BaseButtonProps } from '../button/base-button';\nimport { a11yBoolean } from '../utils/a11y';\n\n/**\n * @since 1.5.0\n */\n@Component({\n tag: 'ix-pagination',\n styleUrl: 'pagination.scss',\n shadow: true,\n})\nexport class Pagination {\n private readonly baseButtonConfig: BaseButtonProps = {\n variant: 'secondary',\n outline: false,\n ghost: true,\n iconOnly: true,\n iconOval: false,\n disabled: false,\n icon: '',\n loading: false,\n selected: false,\n type: 'button',\n extraClasses: {\n ['w-auto']: true,\n },\n };\n\n private readonly maxCountPages = 7;\n\n @Element() hostElement!: HTMLIxPaginationElement;\n\n /**\n * Advanced mode\n */\n @Prop() advanced: boolean;\n\n /**\n * Number of items shown at once.\n * Can only be changed in advaced mode.\n */\n @Prop() itemCount = 15;\n\n /**\n * Show item count in advanced mode\n */\n @Prop() showItemCount = true;\n\n /**\n * Total number of pages\n */\n @Prop() count: number;\n\n /**\n * Zero based index of currently selected page\n */\n @Prop({ mutable: true }) selectedPage = 0;\n\n /**\n * i18n\n */\n @Prop() i18nPage = 'Page';\n\n /**\n * i18n\n */\n @Prop() i18nOf = 'of';\n\n /**\n /**\n * i18n\n */\n @Prop() i18nItems = 'Items';\n\n /**\n * Page selection event\n */\n @Event() pageSelected: EventEmitter<number>;\n\n /**\n * Item count change event\n */\n @Event() itemCountChanged: EventEmitter<number>;\n\n private selectPage(index: number) {\n if (index < 0) {\n this.selectedPage = 0;\n } else if (index > this.count - 1) {\n this.selectedPage = this.count - 1;\n } else {\n this.selectedPage = index;\n }\n\n this.pageSelected.emit(this.selectedPage);\n }\n\n private increase() {\n if (this.selectedPage === this.count - 1) {\n return;\n }\n\n this.selectPage(this.selectedPage + 1);\n }\n\n private decrease() {\n if (this.selectedPage === 0) {\n return;\n }\n\n this.selectPage(this.selectedPage - 1);\n }\n\n private getPageButton(index: number) {\n const baseButtonProps: BaseButtonProps = {\n ...this.baseButtonConfig,\n onClick: () => this.selectPage(index),\n selected: this.selectedPage === index,\n ariaAttributes: {\n 'aria-pressed': a11yBoolean(this.selectedPage === index),\n },\n };\n\n return <BaseButton {...baseButtonProps}>{index + 1}</BaseButton>;\n }\n\n private renderPageButtons() {\n const pagesBeforeOverflow = Math.floor(this.maxCountPages / 2);\n const hasOverflow = this.count > this.maxCountPages;\n const hasOverflowStart =\n hasOverflow && this.selectedPage > pagesBeforeOverflow;\n const hasOverflowEnd =\n hasOverflow && this.selectedPage < this.count - pagesBeforeOverflow - 1;\n const pageButtons = [];\n\n let start = 0;\n let end = Math.min(this.count, this.maxCountPages);\n let pageCount = Math.floor((this.maxCountPages - 4) / 2);\n\n if (hasOverflowStart) {\n const baseButtonProps = {\n ...this.baseButtonConfig,\n onClick: () => {\n if (hasOverflowEnd) {\n this.selectPage(this.selectedPage - Math.max(0, 2 * pageCount + 1));\n } else {\n this.selectPage(this.count - this.maxCountPages);\n }\n },\n };\n pageButtons.push(this.getPageButton(0));\n pageButtons.push(<BaseButton {...baseButtonProps}>...</BaseButton>);\n\n if (hasOverflowEnd) {\n start = this.count - this.maxCountPages + 2;\n } else {\n start = this.count - this.maxCountPages + 2;\n end = this.count;\n }\n }\n\n if (hasOverflowEnd) {\n if (hasOverflowStart) {\n start = this.selectedPage - pageCount;\n end = this.selectedPage + pageCount + 1;\n } else {\n end = this.maxCountPages - 2;\n }\n }\n\n for (let i = start; i < end; i++) {\n pageButtons.push(this.getPageButton(i));\n }\n\n if (hasOverflowEnd) {\n const baseButtonProps = {\n ...this.baseButtonConfig,\n onClick: () => {\n if (hasOverflowStart) {\n this.selectPage(this.selectedPage + Math.max(0, 2 * pageCount + 1));\n } else {\n this.selectPage(this.maxCountPages - 1);\n }\n },\n };\n pageButtons.push(<BaseButton {...baseButtonProps}>...</BaseButton>);\n pageButtons.push(this.getPageButton(this.count - 1));\n }\n\n return <span class=\"page-buttons\">{pageButtons}</span>;\n }\n\n render() {\n return (\n <Host>\n <ix-icon-button\n disabled={this.selectedPage === 0}\n ghost\n icon={'chevron-left-small'}\n onClick={() => this.decrease()}\n ></ix-icon-button>\n\n {this.advanced ? (\n <div class=\"advanced-pagination\">\n <ix-typography variant=\"default\">{this.i18nPage}</ix-typography>\n <input\n class=\"form-control page-selection\"\n type=\"number\"\n min=\"1\"\n max={this.count}\n value={this.selectedPage + 1}\n onChange={(e) => {\n const index = Number.parseInt(e.target['value']);\n this.selectPage(index - 1);\n }}\n />\n <span class=\"total-count\">\n <ix-typography variant=\"default\">\n {this.i18nOf} {this.count}\n </ix-typography>\n </span>\n </div>\n ) : (\n <span class=\"basic-pagination\">{this.renderPageButtons()} </span>\n )}\n\n <ix-icon-button\n disabled={this.selectedPage === this.count - 1}\n ghost\n icon={'chevron-right-small'}\n onClick={() => this.increase()}\n ></ix-icon-button>\n\n {this.advanced && this.showItemCount ? (\n <span class=\"item-count\">\n <ix-typography variant=\"default\">{this.i18nItems}</ix-typography>\n <ix-select\n hideListHeader\n i18nPlaceholder=\"\"\n i18nSelectListHeader=\"\"\n value={`${this.itemCount}`}\n onValueChange={(e) => {\n const count = Number.parseInt(\n Array.isArray(e.detail) ? e.detail[0] : e.detail\n );\n\n this.itemCountChanged.emit(count);\n }}\n >\n <ix-select-item label=\"10\" value=\"10\"></ix-select-item>\n <ix-select-item label=\"15\" value=\"15\"></ix-select-item>\n <ix-select-item label=\"20\" value=\"20\"></ix-select-item>\n <ix-select-item label=\"40\" value=\"40\"></ix-select-item>\n <ix-select-item label=\"100\" value=\"100\"></ix-select-item>\n </ix-select>\n </span>\n ) : (\n ''\n )}\n </Host>\n );\n }\n}\n"],"mappings":"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"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{r as t,c as e,h as r,H as o,g as i}from"./p-76a509c7.js";const a='@charset "UTF-8";:host{position:relative;display:flex;align-items:center;justify-content:center;padding:10px 1.5rem;line-height:20px;font-size:14px;font-weight:bold;background-color:var(--theme-tab--background);color:var(--theme-tab--color)}: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 ::after{content:"";position:absolute;background-color:var(--theme-tab-indicator--background);width:100%;height:var(--theme-tab-indicator--height);left:0}:host .text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:middle}:host .text span,:host .text span::before{pointer-events:none}:host .circle{display:flex;justify-content:center;align-items:center;height:3rem;width:3rem;background-color:var(--theme-animated-tab-indicator--background);border-radius:50%;border:2px solid var(--theme-animated-tab-circle--border-color);color:var(--theme-an…icon--color);cursor:pointer}:host .circle.selected:not(.disabled){background-color:var(--theme-animated-tab-circle--background--selected);color:var(--theme-animated-tab-icon--color--selected);border-color:var(--theme-animated-tab-circle--border-color--selected)}:host .circle.selected:not(.disabled):hover{background-color:var(--theme-animated-tab-circle--background--selected)}:host .circle:hover{background-color:var(--theme-animated-tab-circle--background--hover)}:host .circle:active{background-color:var(--theme-animated-tab-circle--background--active)}:host .circle:active{background-color:var(--theme-animated-tab-circle--background--active)}:host .circle.disabled{background-color:var(--theme-animated-tab-circle--background--disabled);border-color:var(--theme-animated-tab-circle--border-color--disabled)}:host .counter{position:absolute;z-index:1;height:16px;width:auto;background-color:var(--theme-pill-outline--background);border:1px solid var(--theme-tab-pill--border-color);border-radius:100px;bottom:6px;display:flex;justify-content:center;align-items:center;padding-left:0.25rem;padding-right:0.25rem;font-size:12px;line-height:14px;color:var(--theme-pill-outline--color);cursor:pointer}:host .counter.selected{border-color:var(--theme-tab-pill--border-color--selected)}:host .counter.selected::after{display:none}:host .counter.disabled{border-color:var(--theme-tab-pill--border-color--disabled)}:host .counter::after{display:none}:host .hidden{display:none}:host(.circle){height:72px}:host(.top) ::after{top:0}:host(.bottom) ::after{bottom:0}:host(.stretched){flex-basis:100%;width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host(:hover:not(.circle)){background-color:var(--theme-tab--background--hover);color:var(--theme-tab-color-hover);cursor:pointer}:host(:hover:not(.circle)) ::after{background-color:var(--theme-tab-indicator--background--hover)}:host(:active:not(.circle)){background-color:var(--theme-tab--background--active);color:var(--theme-tab-color--active)}:host(:active:not(.circle)) ::after{background-color:var(--theme-tab-indicator--background--active)}:host(:focus-visible){outline:0px solid var(--focus--border-color)}:host(:focus-visible) .circle{outline:1px solid var(--focus--border-color)}:host(:focus-visible:not(.circle)){outline:1px solid var(--focus--border-color)}:host(.disabled){pointer-events:none;color:var(--theme-tab--color--disabled);background-color:var(--theme-tab--background--disabled)}:host(.disabled) ::after{background-color:var(--theme-tab-indicator--background--disabled)}:host(.selected:not(.disabled)){background-color:var(--theme-tab--background--selected);color:var(--theme-tab--color--selected)}:host(.selected:not(.disabled)) ::after{background-color:var(--theme-tab-indicator--background--selected)}:host(.icon){padding:1.5rem 0.5rem}:host(.small-tab){height:32px;padding:1rem}:host(.small-tab.icon){padding:1rem 0.25rem}';const s=class{constructor(r){t(this,r);this.tabClick=e(this,"tabClick",7);this.selected=false;this.disabled=false;this.small=false;this.icon=false;this.rounded=false;this.counter=undefined;this.layout="auto";this.placement="bottom"}tabItemClasses(t){return{selected:t.selected,disabled:t.disabled,"small-tab":t.small,icon:t.small,stretched:t.layout==="stretched",bottom:t.placement==="bottom",top:t.placement==="top",circle:t.circle}}render(){return r(o,{class:this.tabItemClasses({selected:this.selected,disabled:this.disabled,small:this.small,icon:this.icon,layout:this.layout,placement:this.placement,circle:this.rounded}),tabIndex:0,onClick:t=>{const e=this.tabClick.emit({nativeEvent:t});if(e.defaultPrevented){t.stopPropagation()}}},r("div",{class:{circle:this.rounded,text:!this.rounded,selected:this.selected,disabled:this.disabled}},r("slot",null)),r("div",{class:{counter:true,selected:this.selected,hidden:!(this.rounded&&this.counter!==undefined),disabled:this.disabled}},this.counter))}};s.style=a;const c=t=>{if(typeof __zone_symbol__requestAnimationFrame==="function"){return __zone_symbol__requestAnimationFrame(t)}if(typeof requestAnimationFrame==="function"){return requestAnimationFrame(t)}return setTimeout(t)};const n=":host{width:auto;display:flex;align-items:center;position:relative}: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 .tab-items{overflow:hidden;scroll-behavior:smooth;width:100%}:host .tab-items .items-content{display:flex;align-items:center}:host .arrow{position:absolute;display:flex;align-items:center;justify-content:center;width:32px;height:32px;top:0;bottom:0;left:0;margin:auto 0;border-radius:4px;color:var(--theme-btn-invisible-primary--color);background-color:var(--theme-btn-invisible-primary--background);z-index:2}:host .arrow:hover{color:var(--theme-btn-invisible-primary--color--hover);background-color:var(--theme-btn-invisible-primary--background--hover)}:host .arrow:active{color:var(--theme-btn-invisible-primary--color--active);background-color:var(--theme-btn-invisible-primary--background--active)}:host .arrow.right{left:auto;right:0}:host .overflow-shadow{display:block;position:relative;height:100%;width:100%;pointer-events:all}:host .overflow-shadow.shadow-left{-webkit-mask-image:linear-gradient(90deg, transparent 0px, black 45px);mask-image:linear-gradient(90deg, transparent 0px, black 45px)}:host .overflow-shadow.shadow-right{-webkit-mask-image:linear-gradient(90deg, black calc(100% - 45px), transparent 100%);mask-image:linear-gradient(90deg, black calc(100% - 45px), transparent 100%)}:host .overflow-shadow.shadow-both{-webkit-mask-image:linear-gradient(90deg, transparent 0px, black 45px, black calc(100% - 45px), transparent 100%);mask-image:linear-gradient(90deg, transparent 0px, black 45px, black calc(100% - 45px), transparent 100%)}";const l=class{constructor(r){t(this,r);this.selectedChange=e(this,"selectedChange",7);this.windowStartSize=window.innerWidth;this.clickAction={timeout:null,isClick:true};this.small=false;this.rounded=false;this.selected=0;this.layout="auto";this.placement="bottom";this.totalItems=0;this.currentScrollAmount=0;this.scrollAmount=100;this.scrollActionAmount=0}get arrowLeftElement(){return this.hostElement.shadowRoot.querySelector("[data-arrow-left]")}get arrowRightElement(){return this.hostElement.shadowRoot.querySelector("[data-arrow-right]")}onWindowResize(){this.totalItems=0;this.totalItems=this.getTabs().length;if(this.windowStartSize===0)return this.windowStartSize=window.innerWidth;this.move(this.windowStartSize-window.innerWidth);this.windowStartSize=window.innerWidth}getTabs(){return Array.from(this.hostElement.querySelectorAll("ix-tab-item"))}getTab(t){return this.getTabs()[t]}getTabsWrapper(){return this.hostElement.shadowRoot.querySelector(".items-content")}showArrows(){try{const t=this.getTabsWrapper();return t.scrollWidth>Math.ceil(t.getBoundingClientRect().width)&&this.layout==="auto"}catch(t){return false}}showPreviousArrow(){try{return this.showArrows()&&this.scrollActionAmount<0}catch(t){return false}}showNextArrow(){try{const t=this.getTabsWrapper();const e=t.getBoundingClientRect();return this.showArrows()&&this.scrollActionAmount>(t.scrollWidth-e.width)*-1}catch(t){return false}}getArrowStyle(t){return{opacity:t?"1":"0",zIndex:t?"1":"-1"}}move(t,e=false){const r=this.getTabsWrapper();const o=(r.scrollWidth-r.getBoundingClientRect().width)*-1;t=this.currentScrollAmount+t;t=t>0?0:t<o?o:t;const i=[`transform: translateX(${t}px);`,e?"transition: all ease-in-out 400ms;":""].join("");r.setAttribute("style",i);if(e)this.currentScrollAmount=this.scrollActionAmount=t;else this.scrollActionAmount=t}moveTabToView(t){if(!this.showArrows())return;const e=this.getTab(t).getBoundingClientRect();const r=e.x*-1;this.move(r,true)}setSelected(t){this.selected=t}clickTab(t){if(this.dragStop()){return}const{defaultPrevented:e}=this.selectedChange.emit(t);if(e){return}this.setSelected(t);this.moveTabToView(t)}dragStart(t,e){if(!this.showArrows())return;if(e.button>0)return;this.clickAction.timeout=this.clickAction.timeout===null?setTimeout((()=>this.clickAction.isClick=false),300):null;const r=parseFloat(window.getComputedStyle(t).left);const o=e.clientX;const i=t=>this.dragMove(t,r,o);window.addEventListener("mouseup",(()=>{window.removeEventListener("mousemove",i,false);this.dragStop()}));window.addEventListener("mousemove",i,false)}dragMove(t,e,r){this.move(t.clientX+e-r)}dragStop(){clearTimeout(this.clickAction.timeout);this.clickAction.timeout=null;if(this.clickAction.isClick)return false;this.currentScrollAmount=this.scrollActionAmount;this.clickAction.isClick=true;return true}componentWillLoad(){const t=this.getTabs();t.map(((t,e)=>{if(this.small)t.setAttribute("small","true");if(this.rounded)t.setAttribute("rounded","true");t.setAttribute("layout",this.layout);t.setAttribute("selected",e===this.selected?"true":"false");t.setAttribute("placement",this.placement)}))}componentDidRender(){const t=this.getTabs();this.totalItems=t.length;t.map(((t,e)=>{t.setAttribute("selected",e===this.selected?"true":"false")}))}componentWillRender(){c((()=>{const t=this.showNextArrow();const e=this.showPreviousArrow();Object.assign(this.arrowLeftElement.style,this.getArrowStyle(e));Object.assign(this.arrowRightElement.style,this.getArrowStyle(t))}))}componentDidLoad(){const t=this.getTabs();t.forEach((t=>{t.addEventListener("mousedown",(e=>this.dragStart(t,e)))}))}onTabClick(t){if(t.defaultPrevented){return}const e=t.target;const r=this.getTabs();r.forEach(((t,r)=>{if(!t.disabled&&t===e){this.clickTab(r)}}))}render(){return r(o,null,r("div",{class:"arrow","data-arrow-left":true,onClick:()=>this.move(this.scrollAmount,true)},r("ix-icon",{name:"chevron-left-small"})),r("div",{class:{"tab-items":true,"overflow-shadow":true,"shadow-left":this.showPreviousArrow(),"shadow-right":this.showNextArrow(),"shadow-both":this.showNextArrow()&&this.showPreviousArrow()}},r("div",{class:"items-content"},r("slot",null))),r("div",{class:"arrow right","data-arrow-right":true,onClick:()=>this.move(-this.scrollAmount,true)},r("ix-icon",{name:"chevron-right-small"})))}get hostElement(){return i(this)}};l.style=n;export{s as ix_tab_item,l as ix_tabs};
|
|
2
|
+
//# sourceMappingURL=p-8ba5f3c5.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["tabItemCss","TabItem","tabItemClasses","props","selected","disabled","small","icon","stretched","layout","bottom","placement","top","circle","render","h","Host","class","this","rounded","tabIndex","onClick","event","clientEvent","tabClick","emit","nativeEvent","defaultPrevented","stopPropagation","text","counter","hidden","undefined","requestAnimationFrameNoNgZone","callback","__zone_symbol__requestAnimationFrame","requestAnimationFrame","setTimeout","tabsCss","Tabs","windowStartSize","window","innerWidth","clickAction","timeout","isClick","arrowLeftElement","hostElement","shadowRoot","querySelector","arrowRightElement","onWindowResize","totalItems","getTabs","length","move","Array","from","querySelectorAll","getTab","getTabsWrapper","showArrows","tabWrapper","scrollWidth","Math","ceil","getBoundingClientRect","width","error","showPreviousArrow","scrollActionAmount","showNextArrow","tabWrapperRect","getArrowStyle","condition","opacity","zIndex","amount","click","maxScrollWidth","currentScrollAmount","styles","join","setAttribute","moveTabToView","tab","x","setSelected","index","clickTab","dragStop","selectedChange","dragStart","element","button","tabPositionX","parseFloat","getComputedStyle","left","mousedownPositionX","clientX","dragMove","addEventListener","removeEventListener","tabX","mousedownX","clearTimeout","componentWillLoad","tabs","map","componentDidRender","componentWillRender","previousArrow","Object","assign","style","componentDidLoad","forEach","onTabClick","target","scrollAmount","name"],"sources":["./src/components/tab-item/tab-item.scss?tag=ix-tab-item&encapsulation=shadow","./src/components/tab-item/tab-item.tsx","./src/components/utils/requestAnimationFrame.ts","./src/components/tabs/tabs.scss?tag=ix-tabs&encapsulation=shadow","./src/components/tabs/tabs.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@import 'common-variables';\n@import 'mixins/text-truncation';\n@import 'mixins/hover';\n@import 'mixins/shadow-dom/component';\n\n:host {\n @include ix-component;\n position: relative;\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 10px $large-space;\n line-height: 20px;\n font-size: 14px;\n font-weight: bold;\n background-color: var(--theme-tab--background);\n color: var(--theme-tab--color);\n\n ::after {\n content: '';\n position: absolute;\n background-color: var(--theme-tab-indicator--background);\n width: 100%;\n height: var(--theme-tab-indicator--height);\n left: 0;\n }\n\n .text {\n @include ellipsis;\n\n span,\n span::before {\n pointer-events: none;\n }\n\n vertical-align: middle;\n }\n\n .circle {\n display: flex;\n justify-content: center;\n align-items: center;\n height: 3rem;\n width: 3rem;\n background-color: var(--theme-animated-tab-indicator--background);\n border-radius: 50%;\n border: 2px solid var(--theme-animated-tab-circle--border-color);\n color: var(--theme-an…icon--color);\n cursor: pointer;\n\n &.selected:not(.disabled) {\n background-color: var(--theme-animated-tab-circle--background--selected);\n color: var(--theme-animated-tab-icon--color--selected);\n border-color: var(--theme-animated-tab-circle--border-color--selected);\n\n &:hover {\n background-color: var(\n --theme-animated-tab-circle--background--selected\n );\n }\n }\n\n &:hover {\n background-color: var(--theme-animated-tab-circle--background--hover);\n }\n\n &:active {\n background-color: var(--theme-animated-tab-circle--background--active);\n }\n\n &:active {\n background-color: var(--theme-animated-tab-circle--background--active);\n }\n\n &.disabled {\n background-color: var(--theme-animated-tab-circle--background--disabled);\n border-color: var(--theme-animated-tab-circle--border-color--disabled);\n }\n }\n\n .counter {\n position: absolute;\n z-index: 1;\n height: 16px;\n width: auto;\n background-color: var(--theme-pill-outline--background);\n border: 1px solid var(--theme-tab-pill--border-color);\n border-radius: 100px;\n bottom: 6px;\n display: flex;\n justify-content: center;\n align-items: center;\n padding-left: $tiny-space;\n padding-right: $tiny-space;\n font-size: 12px;\n line-height: 14px;\n color: var(--theme-pill-outline--color);\n cursor: pointer;\n\n &.selected {\n border-color: var(--theme-tab-pill--border-color--selected);\n\n &::after {\n display: none;\n }\n }\n\n &.disabled {\n border-color: var(--theme-tab-pill--border-color--disabled);\n }\n\n &::after {\n display: none;\n }\n }\n\n .hidden {\n display: none;\n }\n}\n\n:host(.circle) {\n height: 72px;\n}\n\n:host(.top) {\n ::after {\n top: 0;\n }\n}\n\n:host(.bottom) {\n ::after {\n bottom: 0;\n }\n}\n\n:host(.stretched) {\n flex-basis: 100%;\n width: 100%;\n @include ellipsis;\n}\n\n:host(:hover:not(.circle)) {\n background-color: var(--theme-tab--background--hover);\n color: var(--theme-tab-color-hover);\n cursor: pointer;\n\n ::after {\n background-color: var(--theme-tab-indicator--background--hover);\n }\n}\n\n:host(:active:not(.circle)) {\n background-color: var(--theme-tab--background--active);\n color: var(--theme-tab-color--active);\n\n ::after {\n background-color: var(--theme-tab-indicator--background--active);\n }\n}\n\n:host(:focus-visible) {\n outline: 0px solid var(--focus--border-color);\n\n .circle {\n outline: 1px solid var(--focus--border-color);\n }\n}\n\n:host(:focus-visible:not(.circle)) {\n outline: 1px solid var(--focus--border-color);\n}\n\n:host(.disabled) {\n pointer-events: none;\n color: var(--theme-tab--color--disabled);\n background-color: var(--theme-tab--background--disabled);\n\n ::after {\n background-color: var(--theme-tab-indicator--background--disabled);\n }\n}\n\n:host(.selected:not(.disabled)) {\n background-color: var(--theme-tab--background--selected);\n color: var(--theme-tab--color--selected);\n\n ::after {\n background-color: var(--theme-tab-indicator--background--selected);\n }\n}\n\n:host(.icon) {\n padding: $large-space $small-space;\n}\n\n:host(.small-tab) {\n height: 32px;\n padding: $default-space;\n}\n\n:host(.small-tab.icon) {\n padding: $default-space $tiny-space;\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Component, Event, EventEmitter, h, Host, Prop } from '@stencil/core';\n\nexport type TabClickDetail = {\n nativeEvent: MouseEvent;\n};\n\n@Component({\n tag: 'ix-tab-item',\n styleUrl: 'tab-item.scss',\n shadow: true,\n})\nexport class TabItem {\n /**\n * Set selected tab\n */\n @Prop() selected = false;\n\n /**\n * Set disabled tab\n */\n @Prop() disabled = false;\n\n /**\n * Set small size tab\n */\n @Prop() small = false;\n\n /**\n * Set icon only tab\n */\n @Prop() icon = false;\n\n /**\n * Set rounded tab\n */\n @Prop() rounded = false;\n\n /**\n * Set counter value\n */\n @Prop() counter: number;\n\n /**\n * Set layout width style\n */\n @Prop() layout: 'auto' | 'stretched' = 'auto';\n\n /**\n * Set selected placement\n */\n @Prop() placement: 'bottom' | 'top' = 'bottom';\n\n /**\n * On tab click\n *\n * @since 2.0.0\n */\n @Event() tabClick: EventEmitter<TabClickDetail>;\n\n private tabItemClasses(props: {\n selected: boolean;\n disabled: boolean;\n small: boolean;\n icon: boolean;\n circle: boolean;\n layout: 'auto' | 'stretched';\n placement: 'bottom' | 'top';\n }) {\n return {\n selected: props.selected,\n disabled: props.disabled,\n 'small-tab': props.small,\n icon: props.small,\n stretched: props.layout === 'stretched',\n bottom: props.placement === 'bottom',\n top: props.placement === 'top',\n circle: props.circle,\n };\n }\n\n render() {\n return (\n <Host\n class={this.tabItemClasses({\n selected: this.selected,\n disabled: this.disabled,\n small: this.small,\n icon: this.icon,\n layout: this.layout,\n placement: this.placement,\n circle: this.rounded,\n })}\n tabIndex={0}\n onClick={(event: MouseEvent) => {\n const clientEvent = this.tabClick.emit({\n nativeEvent: event,\n });\n\n if (clientEvent.defaultPrevented) {\n event.stopPropagation();\n }\n }}\n >\n <div\n class={{\n circle: this.rounded,\n text: !this.rounded,\n selected: this.selected,\n disabled: this.disabled,\n }}\n >\n <slot></slot>\n </div>\n <div\n class={{\n counter: true,\n selected: this.selected,\n hidden: !(this.rounded && this.counter !== undefined),\n disabled: this.disabled,\n }}\n >\n {this.counter}\n </div>\n </Host>\n );\n }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\ndeclare const __zone_symbol__requestAnimationFrame: any;\n\n/**\n * Prevents angular from change detection when requesting an animation frame\n *\n * Credits goes to:\n * https://github.com/ionic-team/ionic-framework/blob/main/core/src/utils/helpers.ts\n */\nexport const requestAnimationFrameNoNgZone = (\n callback: (...args: any[]) => void\n) => {\n if (typeof __zone_symbol__requestAnimationFrame === 'function') {\n return __zone_symbol__requestAnimationFrame(callback);\n }\n if (typeof requestAnimationFrame === 'function') {\n return requestAnimationFrame(callback);\n }\n return setTimeout(callback);\n};\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@import 'common-variables';\n@import 'mixins/text-truncation';\n@import 'mixins/shadow-dom/component';\n\n:host {\n @include ix-component;\n width: auto;\n display: flex;\n align-items: center;\n position: relative;\n\n .tab-items {\n overflow: hidden;\n scroll-behavior: smooth;\n width: 100%;\n\n .items-content {\n display: flex;\n align-items: center;\n }\n }\n\n .arrow {\n position: absolute;\n display: flex;\n align-items: center;\n justify-content: center;\n width: 32px;\n height: 32px;\n top: 0;\n bottom: 0;\n left: 0;\n margin: auto 0;\n border-radius: 4px;\n color: var(--theme-btn-invisible-primary--color);\n background-color: var(--theme-btn-invisible-primary--background);\n z-index: 2;\n\n &:hover {\n color: var(--theme-btn-invisible-primary--color--hover);\n background-color: var(--theme-btn-invisible-primary--background--hover);\n }\n\n &:active {\n color: var(--theme-btn-invisible-primary--color--active);\n background-color: var(--theme-btn-invisible-primary--background--active);\n }\n\n &.right {\n left: auto;\n right: 0;\n }\n }\n\n .overflow-shadow {\n display: block;\n position: relative;\n height: 100%;\n width: 100%;\n pointer-events: all;\n\n &.shadow-left {\n mask-image: linear-gradient(90deg, transparent 0px, black 45px);\n }\n\n &.shadow-right {\n mask-image: linear-gradient(\n 90deg,\n black calc(100% - 45px),\n transparent 100%\n );\n }\n\n &.shadow-both {\n mask-image: linear-gradient(\n 90deg,\n transparent 0px,\n black 45px,\n black calc(100% - 45px),\n transparent 100%\n );\n }\n }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Listen,\n Prop,\n State,\n} from '@stencil/core';\nimport { requestAnimationFrameNoNgZone } from '../utils/requestAnimationFrame';\n\n@Component({\n tag: 'ix-tabs',\n styleUrl: 'tabs.scss',\n shadow: true,\n})\nexport class Tabs {\n @Element() hostElement!: HTMLIxTabsElement;\n\n /**\n * Set tab items to small size\n */\n @Prop() small = false;\n\n /**\n * Set rounded tabs\n */\n @Prop() rounded = false;\n\n /**\n * Set default selected tab by index\n */\n @Prop({ mutable: true }) selected = 0;\n\n /**\n * Set layout width style\n */\n @Prop() layout: 'auto' | 'stretched' = 'auto';\n\n /**\n * Set placement style\n */\n @Prop() placement: 'bottom' | 'top' = 'bottom';\n\n /**\n * `selected` property changed\n *\n * @since 2.0.0\n */\n @Event() selectedChange: EventEmitter<number>;\n\n @State() totalItems = 0;\n @State() currentScrollAmount = 0;\n @State() scrollAmount = 100;\n\n @State() scrollActionAmount = 0;\n\n private windowStartSize = window.innerWidth;\n\n private get arrowLeftElement() {\n return this.hostElement.shadowRoot.querySelector(\n '[data-arrow-left]'\n ) as HTMLElement;\n }\n\n private get arrowRightElement() {\n return this.hostElement.shadowRoot.querySelector(\n '[data-arrow-right]'\n ) as HTMLElement;\n }\n\n private clickAction: {\n timeout: NodeJS.Timeout;\n isClick: boolean;\n } = {\n timeout: null,\n isClick: true,\n };\n\n @Listen('resize', { target: 'window' })\n onWindowResize() {\n this.totalItems = 0;\n this.totalItems = this.getTabs().length;\n\n if (this.windowStartSize === 0)\n return (this.windowStartSize = window.innerWidth);\n this.move(this.windowStartSize - window.innerWidth);\n this.windowStartSize = window.innerWidth;\n }\n\n private getTabs() {\n return Array.from(this.hostElement.querySelectorAll('ix-tab-item'));\n }\n\n private getTab(tabIndex: number) {\n return this.getTabs()[tabIndex];\n }\n\n private getTabsWrapper() {\n return this.hostElement.shadowRoot.querySelector('.items-content');\n }\n\n private showArrows() {\n try {\n const tabWrapper = this.getTabsWrapper();\n return (\n tabWrapper.scrollWidth >\n Math.ceil(tabWrapper.getBoundingClientRect().width) &&\n this.layout === 'auto'\n );\n } catch (error) {\n return false;\n }\n }\n\n private showPreviousArrow() {\n try {\n return this.showArrows() && this.scrollActionAmount < 0;\n } catch (error) {\n return false;\n }\n }\n\n private showNextArrow() {\n try {\n const tabWrapper = this.getTabsWrapper();\n const tabWrapperRect = tabWrapper.getBoundingClientRect();\n\n return (\n this.showArrows() &&\n this.scrollActionAmount >\n (tabWrapper.scrollWidth - tabWrapperRect.width) * -1\n );\n } catch (error) {\n return false;\n }\n }\n\n private getArrowStyle(condition: boolean) {\n return {\n opacity: condition ? '1' : '0',\n zIndex: condition ? '1' : '-1',\n };\n }\n\n private move(amount: number, click = false) {\n const tabWrapper = this.getTabsWrapper();\n const maxScrollWidth =\n (tabWrapper.scrollWidth - tabWrapper.getBoundingClientRect().width) * -1;\n\n amount = this.currentScrollAmount + amount;\n amount = amount > 0 ? 0 : amount < maxScrollWidth ? maxScrollWidth : amount;\n\n const styles = [\n `transform: translateX(${amount}px);`,\n click ? 'transition: all ease-in-out 400ms;' : '',\n ].join('');\n\n tabWrapper.setAttribute('style', styles);\n\n if (click) this.currentScrollAmount = this.scrollActionAmount = amount;\n else this.scrollActionAmount = amount;\n }\n\n private moveTabToView(tabIndex: number) {\n if (!this.showArrows()) return;\n\n const tab = this.getTab(tabIndex).getBoundingClientRect();\n const amount = tab.x * -1;\n this.move(amount, true);\n }\n\n private setSelected(index: number) {\n this.selected = index;\n }\n\n private clickTab(index: number) {\n if (this.dragStop()) {\n return;\n }\n\n const { defaultPrevented } = this.selectedChange.emit(index);\n if (defaultPrevented) {\n return;\n }\n\n this.setSelected(index);\n this.moveTabToView(index);\n }\n\n private dragStart(element: HTMLIxTabItemElement, event: MouseEvent) {\n if (!this.showArrows()) return;\n if (event.button > 0) return;\n\n this.clickAction.timeout =\n this.clickAction.timeout === null\n ? setTimeout(() => (this.clickAction.isClick = false), 300)\n : null;\n\n const tabPositionX = parseFloat(window.getComputedStyle(element).left);\n const mousedownPositionX = event.clientX;\n const move = (event: MouseEvent) =>\n this.dragMove(event, tabPositionX, mousedownPositionX);\n\n window.addEventListener('mouseup', () => {\n window.removeEventListener('mousemove', move, false);\n this.dragStop();\n });\n window.addEventListener('mousemove', move, false);\n }\n\n private dragMove(event: MouseEvent, tabX: number, mousedownX: number) {\n this.move(event.clientX + tabX - mousedownX);\n }\n\n private dragStop() {\n clearTimeout(this.clickAction.timeout);\n this.clickAction.timeout = null;\n\n if (this.clickAction.isClick) return false;\n\n this.currentScrollAmount = this.scrollActionAmount;\n this.clickAction.isClick = true;\n\n return true;\n }\n\n componentWillLoad() {\n const tabs = this.getTabs();\n\n tabs.map((element, index) => {\n if (this.small) element.setAttribute('small', 'true');\n\n if (this.rounded) element.setAttribute('rounded', 'true');\n\n element.setAttribute('layout', this.layout);\n element.setAttribute(\n 'selected',\n index === this.selected ? 'true' : 'false'\n );\n\n element.setAttribute('placement', this.placement);\n });\n }\n\n componentDidRender() {\n const tabs = this.getTabs();\n this.totalItems = tabs.length;\n\n tabs.map((element, index) => {\n element.setAttribute(\n 'selected',\n index === this.selected ? 'true' : 'false'\n );\n });\n }\n\n componentWillRender() {\n requestAnimationFrameNoNgZone(() => {\n const showNextArrow = this.showNextArrow();\n const previousArrow = this.showPreviousArrow();\n\n Object.assign(\n this.arrowLeftElement.style,\n this.getArrowStyle(previousArrow)\n );\n Object.assign(\n this.arrowRightElement.style,\n this.getArrowStyle(showNextArrow)\n );\n });\n }\n\n componentDidLoad() {\n const tabs = this.getTabs();\n tabs.forEach((element) => {\n element.addEventListener('mousedown', (event) =>\n this.dragStart(element, event)\n );\n });\n }\n\n @Listen('tabClick')\n onTabClick(event: CustomEvent) {\n if (event.defaultPrevented) {\n return;\n }\n\n const target = event.target;\n const tabs = this.getTabs();\n\n tabs.forEach((tab, index) => {\n if (!tab.disabled && tab === target) {\n this.clickTab(index);\n }\n });\n }\n\n render() {\n return (\n <Host>\n <div\n class=\"arrow\"\n data-arrow-left\n onClick={() => this.move(this.scrollAmount, true)}\n >\n <ix-icon name={'chevron-left-small'}></ix-icon>\n </div>\n <div\n class={{\n 'tab-items': true,\n 'overflow-shadow': true,\n 'shadow-left': this.showPreviousArrow(),\n 'shadow-right': this.showNextArrow(),\n 'shadow-both': this.showNextArrow() && this.showPreviousArrow(),\n }}\n >\n <div class=\"items-content\">\n <slot></slot>\n </div>\n </div>\n <div\n class=\"arrow right\"\n data-arrow-right\n onClick={() => this.move(-this.scrollAmount, true)}\n >\n <ix-icon name={'chevron-right-small'}></ix-icon>\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{r as t,c as i,h as e,H as r,g as n}from"./p-76a509c7.js";import{c as s,g as o,a as h}from"./p-3e7b4990.js";import{r as a}from"./p-56ed024b.js";var u=s((function(t,i){(function(i){{t.exports=i()}})((function(){return function(){function t(i,e,r){function n(o,a){if(!e[o]){if(!i[o]){var u="function"==typeof h&&h;if(!a&&u)return u(o,!0);if(s)return s(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=e[o]={exports:{}};i[o][0].call(l.exports,(function(t){var e=i[o][1][t];return n(e||t)}),l,l.exports,t,i,e,r)}return e[o].exports}for(var s="function"==typeof h&&h,o=0;o<r.length;o++)n(r[o]);return n}return t}()({1:[function(t,i,e){Object.defineProperty(e,"__esModule",{value:true});var r=function(){function t(t,i){for(var e=0;e<i.length;e++){var r=i[e];r.enumerable=r.enumerable||false;r.configurable=true;if("value"in r)r.writable=true;Object.defineProperty(t,r.key,r)}}return function(i,e,r){if(e)t(i.prototype,e);if(r)t(i,r);return i}}();function n(t,i,e){if(i in t){Object.defineProperty(t,i,{value:e,enumerable:true,configurable:true,writable:true})}else{t[i]=e}return t}function s(t,i){if(!(t instanceof i)){throw new TypeError("Cannot call a class as a function")}}var o={width:"100%",height:"100%"};var h=function t(i){return Number(i)===Number(i)};var a="classList"in document.documentElement?function(t,i){t.classList.add(i)}:function(t,i){var e=t.getAttribute("class")||"";t.setAttribute("class",e+" "+i)};var u=function(){r(t,null,[{key:"create",value:function i(e,r){return new t(e,r)}},{key:"mergeStyle",value:function t(i,e){for(var r in e){if(i.style[r]!==e[r]){i.style[r]=e[r]}}}},{key:"getMaxBrowserHeight",value:function i(){var e=document.createElement("div");var r=document.createElement("div");t.mergeStyle(e,{position:"absolute",height:"1px",opacity:0});t.mergeStyle(r,{height:"1e7px"});e.appendChild(r);document.body.appendChild(e);var n=r.offsetHeight;document.body.removeChild(e);return n}}]);function t(i,e){var r=this;s(this,t);this._config={};this._lastRepaint=null;this._maxElementHeight=t.getMaxBrowserHeight();this.refresh(i,e);var n=this._config;var o=function t(){var i=r._getScrollPosition();var e=r._lastRepaint;r._renderAnimationFrame=window.requestAnimationFrame(t);if(i===e){return}var s=e?i-e:0;if(!e||s<0||s>r._averageHeight){var o=r._renderChunk();r._lastRepaint=i;if(o!==false&&typeof n.afterRender==="function"){n.afterRender()}}};o()}r(t,[{key:"destroy",value:function t(){window.cancelAnimationFrame(this._renderAnimationFrame)}},{key:"refresh",value:function i(e,r){var s;Object.assign(this._config,o,r);if(!e||e.nodeType!==1){throw new Error("HyperList requires a valid DOM Node container")}this._element=e;var a=this._config;var u=this._scroller||a.scroller||document.createElement(a.scrollerTagName||"tr");if(typeof a.useFragment!=="boolean"){this._config.useFragment=true}if(!a.generate){throw new Error("Missing required `generate` function")}if(!h(a.total)){throw new Error("Invalid required `total` value, expected number")}if(!Array.isArray(a.itemHeight)&&!h(a.itemHeight)){throw new Error("\n Invalid required `itemHeight` value, expected number or array\n ".trim())}else if(h(a.itemHeight)){this._itemHeights=Array(a.total).fill(a.itemHeight)}else{this._itemHeights=a.itemHeight}Object.keys(o).filter((function(t){return t in a})).forEach((function(t){var i=a[t];var e=h(i);if(i&&typeof i!=="string"&&typeof i!=="number"){var r="Invalid optional `"+t+"`, expected string or number";throw new Error(r)}else if(e){a[t]=i+"px"}}));var f=Boolean(a.horizontal);var l=a[f?"width":"height"];if(l){var c=h(l);var v=c?false:l.slice(-1)==="%";var d=c?l:parseInt(l.replace(/px|%/,""),10);var p=window[f?"innerWidth":"innerHeight"];if(v){this._containerSize=p*d/100}else{this._containerSize=h(l)?l:d}}var m=a.scrollContainer;var w=a.itemHeight*a.total;var g=this._maxElementHeight;if(w>g){console.warn(["HyperList: The maximum element height",g+"px has","been exceeded; please reduce your item height."].join(" "))}var b={width:""+a.width,height:m?w+"px":""+a.height,overflow:m?"none":"auto",position:"relative"};t.mergeStyle(e,b);if(m){t.mergeStyle(a.scrollContainer,{overflow:"auto"})}var y=(s={opacity:"0",position:"absolute"},n(s,f?"height":"width","1px"),n(s,f?"width":"height",w+"px"),s);t.mergeStyle(u,y);if(!this._scroller){e.appendChild(u)}var x=this._computeScrollPadding();this._scrollPaddingBottom=x.bottom;this._scrollPaddingTop=x.top;this._scroller=u;this._scrollHeight=this._computeScrollHeight();this._itemPositions=this._itemPositions||Array(a.total).fill(0);this._computePositions(0);this._renderChunk(this._lastRepaint!==null);if(typeof a.afterRender==="function"){a.afterRender()}}},{key:"_getRow",value:function i(e){var r=this._config;var s=r.generate(e);var o=s.height;if(o!==undefined&&h(o)){s=s.element;if(o!==this._itemHeights[e]){this._itemHeights[e]=o;this._computePositions(e);this._scrollHeight=this._computeScrollHeight(e)}}else{o=this._itemHeights[e]}if(!s||s.nodeType!==1){throw new Error("Generator did not return a DOM Node for index: "+e)}a(s,r.rowClassName||"vrow");var u=this._itemPositions[e]+this._scrollPaddingTop;t.mergeStyle(s,n({position:"absolute"},r.horizontal?"left":"top",u+"px"));return s}},{key:"_getScrollPosition",value:function t(){var i=this._config;if(typeof i.overrideScrollPosition==="function"){return i.overrideScrollPosition()}return this._element[i.horizontal?"scrollLeft":"scrollTop"]}},{key:"_renderChunk",value:function t(i){var e=this._config;var r=this._element;var n=this._getScrollPosition();var s=e.total;var o=e.reverse?this._getReverseFrom(n):this._getFrom(n)-1;if(o<0||o-this._screenItemsLen<0){o=0}if(!i&&this._lastFrom===o){return false}this._lastFrom=o;var h=o+this._cachedItemsLen;if(h>s||h+this._cachedItemsLen>s){h=s}var a=e.useFragment?document.createDocumentFragment():[];var u=this._scroller;a[e.useFragment?"appendChild":"push"](u);for(var f=o;f<h;f++){var l=this._getRow(f);a[e.useFragment?"appendChild":"push"](l)}if(e.applyPatch){return e.applyPatch(r,a)}r.innerHTML="";r.appendChild(a)}},{key:"_computePositions",value:function t(){var i=arguments.length>0&&arguments[0]!==undefined?arguments[0]:1;var e=this._config;var r=e.total;var n=e.reverse;if(i<1&&!n){i=1}for(var s=i;s<r;s++){if(n){if(s===0){this._itemPositions[0]=this._scrollHeight-this._itemHeights[0]}else{this._itemPositions[s]=this._itemPositions[s-1]-this._itemHeights[s]}}else{this._itemPositions[s]=this._itemHeights[s-1]+this._itemPositions[s-1]}}}},{key:"_computeScrollHeight",value:function i(){var e,r=this;var s=this._config;var o=Boolean(s.horizontal);var h=s.total;var a=this._itemHeights.reduce((function(t,i){return t+i}),0)+this._scrollPaddingBottom+this._scrollPaddingTop;t.mergeStyle(this._scroller,(e={opacity:0,position:"absolute",top:"0px"},n(e,o?"height":"width","1px"),n(e,o?"width":"height",a+"px"),e));var u=this._itemHeights.slice(0).sort((function(t,i){return t-i}));var f=Math.floor(h/2);var l=h%2===0?(u[f]+u[f-1])/2:u[f];var c=o?"clientWidth":"clientHeight";var v=s.scrollContainer?s.scrollContainer:this._element;var d=v[c]?v[c]:this._containerSize;this._screenItemsLen=Math.ceil(d/l);this._containerSize=d;this._cachedItemsLen=Math.max(this._cachedItemsLen||0,this._screenItemsLen*3);this._averageHeight=l;if(s.reverse){window.requestAnimationFrame((function(){if(o){r._element.scrollLeft=a}else{r._element.scrollTop=a}}))}return a}},{key:"_computeScrollPadding",value:function t(){var i=this._config;var e=Boolean(i.horizontal);var r=i.reverse;var n=window.getComputedStyle(this._element);var s=function t(i){var e=n.getPropertyValue("padding-"+i);return parseInt(e,10)||0};if(e&&r){return{bottom:s("left"),top:s("right")}}else if(e){return{bottom:s("right"),top:s("left")}}else if(r){return{bottom:s("top"),top:s("bottom")}}else{return{bottom:s("bottom"),top:s("top")}}}},{key:"_getFrom",value:function t(i){var e=0;while(this._itemPositions[e]<i){e++}return e}},{key:"_getReverseFrom",value:function t(i){var e=this._config.total-1;while(e>0&&this._itemPositions[e]<i+this._containerSize){e--}return e}}]);return t}();e.default=u;i.exports=e["default"]},{}]},{},[1])(1)}))}));const f=o(u);const l=":host{display:block}";const c=class{constructor(e){t(this,e);this.contextChange=i(this,"contextChange",7);this.nodeToggled=i(this,"nodeToggled",7);this.nodeClicked=i(this,"nodeClicked",7);this.nodeRemoved=i(this,"nodeRemoved",7);this.toggleListener=new Map;this.itemClickListener=new Map;this.updates=new Map;this.hasFirstRender=false;this.root=undefined;this.model=undefined;this.renderItem=undefined;this.context={}}updatePadding(t,i){t.style.paddingLeft=i.level+"rem"}getVirtualizerOptions(){const t=this.buildTreeList(this.model[this.root]);let i=(i,e,r)=>{if(i.hasChildren&&!this.toggleListener.has(e)){const n=e=>{e.preventDefault();e.stopPropagation();const n=this.getContext(t[r].id);n.isExpanded=!n.isExpanded;this.nodeToggled.emit({id:i.id,isExpaned:n.isExpanded});this.setContext(i.id,n)};e.addEventListener("toggle",n);this.toggleListener.set(e,n)}};return{itemHeight:32,total:t.length,generate:e=>{const r=t[e];const n=this.hostElement.querySelector(`[data-tree-node-id="${r.id}"]`);const s=this.getContext(r.id);if(n){n.hasChildren=r.hasChildren;n.context=Object.assign({},s);i(r,n,e);if(this.updates.has(r.id)){const t=this.updates.get(r.id);t(r,Object.assign({},this.context))}this.updatePadding(n,r);return n}const o=t=>{this.updates.set(r.id,t)};let h=null;if(this.renderItem){h=this.renderItem(e,r,t,Object.assign({},this.context),o)}if(h===null){h=a(r,s,o)}const u=h;u.setAttribute("data-tree-node-id",r.id);u.style.paddingRight="1rem";this.updatePadding(u,r);if(!this.itemClickListener.has(u)){const t=t=>{t.preventDefault();t.stopPropagation();Object.values(this.context).forEach((t=>t.isSelected=false));const i=this.getContext(r.id);i.isSelected=true;this.setContext(r.id,i);this.nodeClicked.emit(r.id)};u.addEventListener("itemClick",t);this.itemClickListener.set(u,t)}i(r,u,e);return u}}}setContext(t,i){this.context=Object.assign(Object.assign({},this.context),{[t]:i});this.contextChange.emit(this.context)}getContext(t){if(!this.context){return{isExpanded:false,isSelected:false}}if(!this.context[t]){this.context[t]={isExpanded:false,isSelected:false}}return this.context[t]}buildTreeList(t,i=0){const e=[];if(t===null||t===void 0?void 0:t.hasChildren){const r=i+1;t.children.forEach((t=>{const n=this.model[t];const s=this.getContext(t);e.push(Object.assign(Object.assign({},n),{level:i}));if(n.hasChildren&&s.isExpanded){e.push(...this.buildTreeList(n,r))}}))}return e}componentDidLoad(){this.initList();this.observer=new MutationObserver((t=>{let i=[];t.forEach((t=>{i=[...i,...Array.from(t.removedNodes)];t.addedNodes.forEach((t=>{const e=i.indexOf(t);if(e>=0){i.splice(e,1)}}))}));this.nodeRemoved.emit(i)}));this.observer.observe(this.hostElement,{childList:true})}componentWillRender(){this.hasFirstRender=true;if(this.isListInitialized()){this.refreshList()}else{this.initList()}}disconnectedCallback(){this.hyperlist.destroy();this.observer.disconnect()}modelChange(){if(this.hasFirstRender&&!this.isListInitialized()){this.initList()}}isListInitialized(){var t;const i=(t=this.hyperlist)===null||t===void 0?void 0:t._itemPositions;return i!==undefined&&i.length&&!(i===null||i===void 0?void 0:i.some((t=>t===undefined||Number.isNaN(t))))}refreshList(){if(this.hyperlist){this.hyperlist.refresh(this.hostElement,this.getVirtualizerOptions())}}initList(){var t;if(!this.model){return}(t=this.hyperlist)===null||t===void 0?void 0:t.destroy();const i=this.getVirtualizerOptions();this.hyperlist=new f(this.hostElement,i)}render(){return e(r,null,e("slot",null))}get hostElement(){return n(this)}static get watchers(){return{model:["modelChange"]}}};c.style=l;export{c as ix_tree};
|
|
2
|
-
//# sourceMappingURL=p-
|
|
1
|
+
import{r as t,c as i,h as e,H as r,g as n}from"./p-76a509c7.js";import{c as s,g as o,a as h}from"./p-3e7b4990.js";import{r as a}from"./p-56ed024b.js";var u=s((function(t,i){(function(i){{t.exports=i()}})((function(){return function(){function t(i,e,r){function n(o,a){if(!e[o]){if(!i[o]){var u="function"==typeof h&&h;if(!a&&u)return u(o,!0);if(s)return s(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=e[o]={exports:{}};i[o][0].call(l.exports,(function(t){var e=i[o][1][t];return n(e||t)}),l,l.exports,t,i,e,r)}return e[o].exports}for(var s="function"==typeof h&&h,o=0;o<r.length;o++)n(r[o]);return n}return t}()({1:[function(t,i,e){Object.defineProperty(e,"__esModule",{value:true});var r=function(){function t(t,i){for(var e=0;e<i.length;e++){var r=i[e];r.enumerable=r.enumerable||false;r.configurable=true;if("value"in r)r.writable=true;Object.defineProperty(t,r.key,r)}}return function(i,e,r){if(e)t(i.prototype,e);if(r)t(i,r);return i}}();function n(t,i,e){if(i in t){Object.defineProperty(t,i,{value:e,enumerable:true,configurable:true,writable:true})}else{t[i]=e}return t}function s(t,i){if(!(t instanceof i)){throw new TypeError("Cannot call a class as a function")}}var o={width:"100%",height:"100%"};var h=function t(i){return Number(i)===Number(i)};var a="classList"in document.documentElement?function(t,i){t.classList.add(i)}:function(t,i){var e=t.getAttribute("class")||"";t.setAttribute("class",e+" "+i)};var u=function(){r(t,null,[{key:"create",value:function i(e,r){return new t(e,r)}},{key:"mergeStyle",value:function t(i,e){for(var r in e){if(i.style[r]!==e[r]){i.style[r]=e[r]}}}},{key:"getMaxBrowserHeight",value:function i(){var e=document.createElement("div");var r=document.createElement("div");t.mergeStyle(e,{position:"absolute",height:"1px",opacity:0});t.mergeStyle(r,{height:"1e7px"});e.appendChild(r);document.body.appendChild(e);var n=r.offsetHeight;document.body.removeChild(e);return n}}]);function t(i,e){var r=this;s(this,t);this._config={};this._lastRepaint=null;this._maxElementHeight=t.getMaxBrowserHeight();this.refresh(i,e);var n=this._config;var o=function t(){var i=r._getScrollPosition();var e=r._lastRepaint;r._renderAnimationFrame=window.requestAnimationFrame(t);if(i===e){return}var s=e?i-e:0;if(!e||s<0||s>r._averageHeight){var o=r._renderChunk();r._lastRepaint=i;if(o!==false&&typeof n.afterRender==="function"){n.afterRender()}}};o()}r(t,[{key:"destroy",value:function t(){window.cancelAnimationFrame(this._renderAnimationFrame)}},{key:"refresh",value:function i(e,r){var s;Object.assign(this._config,o,r);if(!e||e.nodeType!==1){throw new Error("HyperList requires a valid DOM Node container")}this._element=e;var a=this._config;var u=this._scroller||a.scroller||document.createElement(a.scrollerTagName||"tr");if(typeof a.useFragment!=="boolean"){this._config.useFragment=true}if(!a.generate){throw new Error("Missing required `generate` function")}if(!h(a.total)){throw new Error("Invalid required `total` value, expected number")}if(!Array.isArray(a.itemHeight)&&!h(a.itemHeight)){throw new Error("\n Invalid required `itemHeight` value, expected number or array\n ".trim())}else if(h(a.itemHeight)){this._itemHeights=Array(a.total).fill(a.itemHeight)}else{this._itemHeights=a.itemHeight}Object.keys(o).filter((function(t){return t in a})).forEach((function(t){var i=a[t];var e=h(i);if(i&&typeof i!=="string"&&typeof i!=="number"){var r="Invalid optional `"+t+"`, expected string or number";throw new Error(r)}else if(e){a[t]=i+"px"}}));var f=Boolean(a.horizontal);var l=a[f?"width":"height"];if(l){var c=h(l);var v=c?false:l.slice(-1)==="%";var d=c?l:parseInt(l.replace(/px|%/,""),10);var p=window[f?"innerWidth":"innerHeight"];if(v){this._containerSize=p*d/100}else{this._containerSize=h(l)?l:d}}var m=a.scrollContainer;var w=a.itemHeight*a.total;var g=this._maxElementHeight;if(w>g){console.warn(["HyperList: The maximum element height",g+"px has","been exceeded; please reduce your item height."].join(" "))}var b={width:""+a.width,height:m?w+"px":""+a.height,overflow:m?"none":"auto",position:"relative"};t.mergeStyle(e,b);if(m){t.mergeStyle(a.scrollContainer,{overflow:"auto"})}var y=(s={opacity:"0",position:"absolute"},n(s,f?"height":"width","1px"),n(s,f?"width":"height",w+"px"),s);t.mergeStyle(u,y);if(!this._scroller){e.appendChild(u)}var x=this._computeScrollPadding();this._scrollPaddingBottom=x.bottom;this._scrollPaddingTop=x.top;this._scroller=u;this._scrollHeight=this._computeScrollHeight();this._itemPositions=this._itemPositions||Array(a.total).fill(0);this._computePositions(0);this._renderChunk(this._lastRepaint!==null);if(typeof a.afterRender==="function"){a.afterRender()}}},{key:"_getRow",value:function i(e){var r=this._config;var s=r.generate(e);var o=s.height;if(o!==undefined&&h(o)){s=s.element;if(o!==this._itemHeights[e]){this._itemHeights[e]=o;this._computePositions(e);this._scrollHeight=this._computeScrollHeight(e)}}else{o=this._itemHeights[e]}if(!s||s.nodeType!==1){throw new Error("Generator did not return a DOM Node for index: "+e)}a(s,r.rowClassName||"vrow");var u=this._itemPositions[e]+this._scrollPaddingTop;t.mergeStyle(s,n({position:"absolute"},r.horizontal?"left":"top",u+"px"));return s}},{key:"_getScrollPosition",value:function t(){var i=this._config;if(typeof i.overrideScrollPosition==="function"){return i.overrideScrollPosition()}return this._element[i.horizontal?"scrollLeft":"scrollTop"]}},{key:"_renderChunk",value:function t(i){var e=this._config;var r=this._element;var n=this._getScrollPosition();var s=e.total;var o=e.reverse?this._getReverseFrom(n):this._getFrom(n)-1;if(o<0||o-this._screenItemsLen<0){o=0}if(!i&&this._lastFrom===o){return false}this._lastFrom=o;var h=o+this._cachedItemsLen;if(h>s||h+this._cachedItemsLen>s){h=s}var a=e.useFragment?document.createDocumentFragment():[];var u=this._scroller;a[e.useFragment?"appendChild":"push"](u);for(var f=o;f<h;f++){var l=this._getRow(f);a[e.useFragment?"appendChild":"push"](l)}if(e.applyPatch){return e.applyPatch(r,a)}r.innerHTML="";r.appendChild(a)}},{key:"_computePositions",value:function t(){var i=arguments.length>0&&arguments[0]!==undefined?arguments[0]:1;var e=this._config;var r=e.total;var n=e.reverse;if(i<1&&!n){i=1}for(var s=i;s<r;s++){if(n){if(s===0){this._itemPositions[0]=this._scrollHeight-this._itemHeights[0]}else{this._itemPositions[s]=this._itemPositions[s-1]-this._itemHeights[s]}}else{this._itemPositions[s]=this._itemHeights[s-1]+this._itemPositions[s-1]}}}},{key:"_computeScrollHeight",value:function i(){var e,r=this;var s=this._config;var o=Boolean(s.horizontal);var h=s.total;var a=this._itemHeights.reduce((function(t,i){return t+i}),0)+this._scrollPaddingBottom+this._scrollPaddingTop;t.mergeStyle(this._scroller,(e={opacity:0,position:"absolute",top:"0px"},n(e,o?"height":"width","1px"),n(e,o?"width":"height",a+"px"),e));var u=this._itemHeights.slice(0).sort((function(t,i){return t-i}));var f=Math.floor(h/2);var l=h%2===0?(u[f]+u[f-1])/2:u[f];var c=o?"clientWidth":"clientHeight";var v=s.scrollContainer?s.scrollContainer:this._element;var d=v[c]?v[c]:this._containerSize;this._screenItemsLen=Math.ceil(d/l);this._containerSize=d;this._cachedItemsLen=Math.max(this._cachedItemsLen||0,this._screenItemsLen*3);this._averageHeight=l;if(s.reverse){window.requestAnimationFrame((function(){if(o){r._element.scrollLeft=a}else{r._element.scrollTop=a}}))}return a}},{key:"_computeScrollPadding",value:function t(){var i=this._config;var e=Boolean(i.horizontal);var r=i.reverse;var n=window.getComputedStyle(this._element);var s=function t(i){var e=n.getPropertyValue("padding-"+i);return parseInt(e,10)||0};if(e&&r){return{bottom:s("left"),top:s("right")}}else if(e){return{bottom:s("right"),top:s("left")}}else if(r){return{bottom:s("top"),top:s("bottom")}}else{return{bottom:s("bottom"),top:s("top")}}}},{key:"_getFrom",value:function t(i){var e=0;while(this._itemPositions[e]<i){e++}return e}},{key:"_getReverseFrom",value:function t(i){var e=this._config.total-1;while(e>0&&this._itemPositions[e]<i+this._containerSize){e--}return e}}]);return t}();e.default=u;i.exports=e["default"]},{}]},{},[1])(1)}))}));const f=o(u);const l=":host{display:block}";const c=class{constructor(e){t(this,e);this.contextChange=i(this,"contextChange",7);this.nodeToggled=i(this,"nodeToggled",7);this.nodeClicked=i(this,"nodeClicked",7);this.nodeRemoved=i(this,"nodeRemoved",7);this.toggleListener=new Map;this.itemClickListener=new Map;this.updates=new Map;this.hasFirstRender=false;this.root=undefined;this.model=undefined;this.renderItem=undefined;this.context={}}updatePadding(t,i){t.style.paddingLeft=i.level+"rem"}getVirtualizerOptions(){const t=this.buildTreeList(this.model[this.root]);let i=(i,e,r)=>{if(i.hasChildren&&!this.toggleListener.has(e)){const n=e=>{e.preventDefault();e.stopPropagation();const n=this.getContext(t[r].id);n.isExpanded=!n.isExpanded;this.nodeToggled.emit({id:i.id,isExpaned:n.isExpanded});this.setContext(i.id,n)};e.addEventListener("toggle",n);this.toggleListener.set(e,n)}};return{itemHeight:32,total:t.length,generate:e=>{const r=t[e];const n=this.hostElement.querySelector(`[data-tree-node-id="${r.id}"]`);const s=this.getContext(r.id);if(n){n.hasChildren=r.hasChildren;n.context=Object.assign({},s);i(r,n,e);if(this.updates.has(r.id)){const t=this.updates.get(r.id);t(r,Object.assign({},this.context))}this.updatePadding(n,r);return n}const o=t=>{this.updates.set(r.id,t)};let h=null;if(this.renderItem){h=this.renderItem(e,r,t,Object.assign({},this.context),o)}if(h===null){h=a(r,s,o)}const u=h;u.setAttribute("data-tree-node-id",r.id);u.style.paddingRight="1rem";this.updatePadding(u,r);if(!this.itemClickListener.has(u)){const t=t=>{t.preventDefault();t.stopPropagation();Object.values(this.context).forEach((t=>t.isSelected=false));const i=this.getContext(r.id);i.isSelected=true;this.setContext(r.id,i);this.nodeClicked.emit(r.id)};u.addEventListener("itemClick",t);this.itemClickListener.set(u,t)}i(r,u,e);return u}}}setContext(t,i){this.context=Object.assign(Object.assign({},this.context),{[t]:i});this.contextChange.emit(this.context)}getContext(t){if(!this.context){return{isExpanded:false,isSelected:false}}if(!this.context[t]){this.context[t]={isExpanded:false,isSelected:false}}return this.context[t]}buildTreeList(t,i=0){const e=[];if(t===null||t===void 0?void 0:t.hasChildren){const r=i+1;t.children.forEach((t=>{const n=this.model[t];const s=this.getContext(t);e.push(Object.assign(Object.assign({},n),{level:i}));if(n.hasChildren&&s.isExpanded){e.push(...this.buildTreeList(n,r))}}))}return e}componentDidLoad(){this.initList();this.observer=new MutationObserver((t=>{let i=[];t.forEach((t=>{i=[...i,...Array.from(t.removedNodes)];t.addedNodes.forEach((t=>{const e=i.indexOf(t);if(e>=0){i.splice(e,1)}}))}));this.nodeRemoved.emit(i)}));this.observer.observe(this.hostElement,{childList:true})}componentWillRender(){this.hasFirstRender=true;if(this.isListInitialized()){this.refreshList()}else{this.initList()}}disconnectedCallback(){var t,i;(t=this.hyperlist)===null||t===void 0?void 0:t.destroy();(i=this.observer)===null||i===void 0?void 0:i.disconnect()}modelChange(){if(this.hasFirstRender&&!this.isListInitialized()){this.initList()}}isListInitialized(){var t;const i=(t=this.hyperlist)===null||t===void 0?void 0:t._itemPositions;return i!==undefined&&i.length&&!(i===null||i===void 0?void 0:i.some((t=>t===undefined||Number.isNaN(t))))}refreshList(){if(this.hyperlist){this.hyperlist.refresh(this.hostElement,this.getVirtualizerOptions())}}initList(){var t;if(!this.model){return}(t=this.hyperlist)===null||t===void 0?void 0:t.destroy();const i=this.getVirtualizerOptions();this.hyperlist=new f(this.hostElement,i)}render(){return e(r,null,e("slot",null))}get hostElement(){return n(this)}static get watchers(){return{model:["modelChange"]}}};c.style=l;export{c as ix_tree};
|
|
2
|
+
//# sourceMappingURL=p-939376fb.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["f","module","exports","r","e","n","t","o","i","c","require","u","a","Error","code","p","call","length","_dereq_","Object","defineProperty","value","_createClass","defineProperties","target","props","descriptor","enumerable","configurable","writable","key","Constructor","protoProps","staticProps","prototype","_defineProperty","obj","_classCallCheck","instance","TypeError","defaultConfig","width","height","isNumber","input","Number","addClass","document","documentElement","element","className","classList","add","oldClass","getAttribute","setAttribute","HyperList","create","userProvidedConfig","mergeStyle","style","getMaxBrowserHeight","wrapper","createElement","fixture","position","opacity","appendChild","body","maxElementHeight","offsetHeight","removeChild","_this","this","_config","_lastRepaint","_maxElementHeight","refresh","config","render","scrollTop","_getScrollPosition","lastRepaint","_renderAnimationFrame","window","requestAnimationFrame","diff","_averageHeight","rendered","_renderChunk","afterRender","destroy","cancelAnimationFrame","_scrollerStyle","assign","nodeType","_element","scroller","_scroller","scrollerTagName","useFragment","generate","total","Array","isArray","itemHeight","trim","_itemHeights","fill","keys","filter","prop","forEach","isValueNumber","msg","isHoriz","Boolean","horizontal","isValuePercent","slice","numberValue","parseInt","replace","innerSize","_containerSize","scrollContainer","scrollerHeight","console","warn","join","elementStyle","overflow","scrollerStyle","padding","_computeScrollPadding","_scrollPaddingBottom","bottom","_scrollPaddingTop","top","_scrollHeight","_computeScrollHeight","_itemPositions","_computePositions","_getRow","item","undefined","rowClassName","overrideScrollPosition","force","from","reverse","_getReverseFrom","_getFrom","_screenItemsLen","_lastFrom","to","_cachedItemsLen","fragment","createDocumentFragment","row","applyPatch","innerHTML","arguments","_HyperList$mergeStyle2","_this2","scrollHeight","reduce","b","sortedItemHeights","sort","middle","Math","floor","averageHeight","clientProp","containerHeight","ceil","max","scrollLeft","isReverse","styles","getComputedStyle","location","cssValue","getPropertyValue","default","treeCss","Tree","toggleListener","Map","itemClickListener","updates","hasFirstRender","updatePadding","paddingLeft","level","getVirtualizerOptions","list","buildTreeList","model","root","setToggleListener","el","index","hasChildren","has","toggleCallback","preventDefault","stopPropagation","context","getContext","id","isExpanded","nodeToggled","emit","isExpaned","setContext","addEventListener","set","renderedTreeItem","hostElement","querySelector","doUpdate","get","update","callback","innerElement","renderItem","renderDefaultItem","paddingRight","itemClickCallback","values","isSelected","nodeClicked","contextChange","itemList","newLevel","children","push","componentDidLoad","initList","observer","MutationObserver","records","removed","record","removedNodes","addedNodes","an","indexOf","splice","nodeRemoved","observe","childList","componentWillRender","isListInitialized","refreshList","disconnectedCallback","_a","hyperlist","_b","disconnect","modelChange","itemPositions","some","isNaN","Hyperlist","h","Host"],"sources":["../../node_modules/hyperlist/dist/hyperlist.js","./src/components/tree/tree.css?tag=ix-tree&encapsulation=shadow","./src/components/tree/tree.tsx"],"sourcesContent":["(function(f){if(typeof exports===\"object\"&&typeof module!==\"undefined\"){module.exports=f()}else if(typeof define===\"function\"&&define.amd){define([],f)}else{var g;if(typeof window!==\"undefined\"){g=window}else if(typeof global!==\"undefined\"){g=global}else if(typeof self!==\"undefined\"){g=self}else{g=this}g.HyperList = f()}})(function(){var define,module,exports;return (function(){function r(e,n,t){function o(i,f){if(!n[i]){if(!e[i]){var c=\"function\"==typeof require&&require;if(!f&&c)return c(i,!0);if(u)return u(i,!0);var a=new Error(\"Cannot find module '\"+i+\"'\");throw a.code=\"MODULE_NOT_FOUND\",a}var p=n[i]={exports:{}};e[i][0].call(p.exports,function(r){var n=e[i][1][r];return o(n||r)},p,p.exports,r,e,n,t)}return n[i].exports}for(var u=\"function\"==typeof require&&require,i=0;i<t.length;i++)o(t[i]);return o}return r})()({1:[function(_dereq_,module,exports){\n'use strict';\n\n// Default configuration.\n\nObject.defineProperty(exports, \"__esModule\", {\n value: true\n});\n\nvar _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if (\"value\" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();\n\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\n\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\n\nvar defaultConfig = {\n width: '100%',\n height: '100%'\n\n // Check for valid number.\n};var isNumber = function isNumber(input) {\n return Number(input) === Number(input);\n};\n\n// Add a class to an element.\nvar addClass = 'classList' in document.documentElement ? function (element, className) {\n element.classList.add(className);\n} : function (element, className) {\n var oldClass = element.getAttribute('class') || '';\n element.setAttribute('class', oldClass + ' ' + className);\n};\n\n/**\n * Creates a HyperList instance that virtually scrolls very large amounts of\n * data effortlessly.\n */\n\nvar HyperList = function () {\n _createClass(HyperList, null, [{\n key: 'create',\n value: function create(element, userProvidedConfig) {\n return new HyperList(element, userProvidedConfig);\n }\n\n /**\n * Merge given css style on an element\n * @param {DOMElement} element\n * @param {Object} style\n */\n\n }, {\n key: 'mergeStyle',\n value: function mergeStyle(element, style) {\n for (var i in style) {\n if (element.style[i] !== style[i]) {\n element.style[i] = style[i];\n }\n }\n }\n }, {\n key: 'getMaxBrowserHeight',\n value: function getMaxBrowserHeight() {\n // Create two elements, the wrapper is `1px` tall and is transparent and\n // positioned at the top of the page. Inside that is an element that gets\n // set to 1 billion pixels. Then reads the max height the browser can\n // calculate.\n var wrapper = document.createElement('div');\n var fixture = document.createElement('div');\n\n // As said above, these values get set to put the fixture elements into the\n // right visual state.\n HyperList.mergeStyle(wrapper, { position: 'absolute', height: '1px', opacity: 0 });\n HyperList.mergeStyle(fixture, { height: '1e7px' });\n\n // Add the fixture into the wrapper element.\n wrapper.appendChild(fixture);\n\n // Apply to the page, the values won't kick in unless this is attached.\n document.body.appendChild(wrapper);\n\n // Get the maximum element height in pixels.\n var maxElementHeight = fixture.offsetHeight;\n\n // Remove the element immediately after reading the value.\n document.body.removeChild(wrapper);\n\n return maxElementHeight;\n }\n }]);\n\n function HyperList(element, userProvidedConfig) {\n var _this = this;\n\n _classCallCheck(this, HyperList);\n\n this._config = {};\n this._lastRepaint = null;\n this._maxElementHeight = HyperList.getMaxBrowserHeight();\n\n this.refresh(element, userProvidedConfig);\n\n var config = this._config;\n\n // Create internal render loop.\n var render = function render() {\n var scrollTop = _this._getScrollPosition();\n var lastRepaint = _this._lastRepaint;\n\n _this._renderAnimationFrame = window.requestAnimationFrame(render);\n\n if (scrollTop === lastRepaint) {\n return;\n }\n\n var diff = lastRepaint ? scrollTop - lastRepaint : 0;\n if (!lastRepaint || diff < 0 || diff > _this._averageHeight) {\n var rendered = _this._renderChunk();\n\n _this._lastRepaint = scrollTop;\n\n if (rendered !== false && typeof config.afterRender === 'function') {\n config.afterRender();\n }\n }\n };\n\n render();\n }\n\n _createClass(HyperList, [{\n key: 'destroy',\n value: function destroy() {\n window.cancelAnimationFrame(this._renderAnimationFrame);\n }\n }, {\n key: 'refresh',\n value: function refresh(element, userProvidedConfig) {\n var _scrollerStyle;\n\n Object.assign(this._config, defaultConfig, userProvidedConfig);\n\n if (!element || element.nodeType !== 1) {\n throw new Error('HyperList requires a valid DOM Node container');\n }\n\n this._element = element;\n\n var config = this._config;\n\n var scroller = this._scroller || config.scroller || document.createElement(config.scrollerTagName || 'tr');\n\n // Default configuration option `useFragment` to `true`.\n if (typeof config.useFragment !== 'boolean') {\n this._config.useFragment = true;\n }\n\n if (!config.generate) {\n throw new Error('Missing required `generate` function');\n }\n\n if (!isNumber(config.total)) {\n throw new Error('Invalid required `total` value, expected number');\n }\n\n if (!Array.isArray(config.itemHeight) && !isNumber(config.itemHeight)) {\n throw new Error('\\n Invalid required `itemHeight` value, expected number or array\\n '.trim());\n } else if (isNumber(config.itemHeight)) {\n this._itemHeights = Array(config.total).fill(config.itemHeight);\n } else {\n this._itemHeights = config.itemHeight;\n }\n\n // Width and height should be coerced to string representations. Either in\n // `%` or `px`.\n Object.keys(defaultConfig).filter(function (prop) {\n return prop in config;\n }).forEach(function (prop) {\n var value = config[prop];\n var isValueNumber = isNumber(value);\n\n if (value && typeof value !== 'string' && typeof value !== 'number') {\n var msg = 'Invalid optional `' + prop + '`, expected string or number';\n throw new Error(msg);\n } else if (isValueNumber) {\n config[prop] = value + 'px';\n }\n });\n\n var isHoriz = Boolean(config.horizontal);\n var value = config[isHoriz ? 'width' : 'height'];\n\n if (value) {\n var isValueNumber = isNumber(value);\n var isValuePercent = isValueNumber ? false : value.slice(-1) === '%';\n // Compute the containerHeight as number\n var numberValue = isValueNumber ? value : parseInt(value.replace(/px|%/, ''), 10);\n var innerSize = window[isHoriz ? 'innerWidth' : 'innerHeight'];\n\n if (isValuePercent) {\n this._containerSize = innerSize * numberValue / 100;\n } else {\n this._containerSize = isNumber(value) ? value : numberValue;\n }\n }\n\n var scrollContainer = config.scrollContainer;\n var scrollerHeight = config.itemHeight * config.total;\n var maxElementHeight = this._maxElementHeight;\n\n if (scrollerHeight > maxElementHeight) {\n console.warn(['HyperList: The maximum element height', maxElementHeight + 'px has', 'been exceeded; please reduce your item height.'].join(' '));\n }\n\n // Decorate the container element with styles that will match\n // the user supplied configuration.\n var elementStyle = {\n width: '' + config.width,\n height: scrollContainer ? scrollerHeight + 'px' : '' + config.height,\n overflow: scrollContainer ? 'none' : 'auto',\n position: 'relative'\n };\n\n HyperList.mergeStyle(element, elementStyle);\n\n if (scrollContainer) {\n HyperList.mergeStyle(config.scrollContainer, { overflow: 'auto' });\n }\n\n var scrollerStyle = (_scrollerStyle = {\n opacity: '0',\n position: 'absolute'\n }, _defineProperty(_scrollerStyle, isHoriz ? 'height' : 'width', '1px'), _defineProperty(_scrollerStyle, isHoriz ? 'width' : 'height', scrollerHeight + 'px'), _scrollerStyle);\n\n HyperList.mergeStyle(scroller, scrollerStyle);\n\n // Only append the scroller element once.\n if (!this._scroller) {\n element.appendChild(scroller);\n }\n\n var padding = this._computeScrollPadding();\n this._scrollPaddingBottom = padding.bottom;\n this._scrollPaddingTop = padding.top;\n\n // Set the scroller instance.\n this._scroller = scroller;\n this._scrollHeight = this._computeScrollHeight();\n\n // Reuse the item positions if refreshed, otherwise set to empty array.\n this._itemPositions = this._itemPositions || Array(config.total).fill(0);\n\n // Each index in the array should represent the position in the DOM.\n this._computePositions(0);\n\n // Render after refreshing. Force render if we're calling refresh manually.\n this._renderChunk(this._lastRepaint !== null);\n\n if (typeof config.afterRender === 'function') {\n config.afterRender();\n }\n }\n }, {\n key: '_getRow',\n value: function _getRow(i) {\n var config = this._config;\n var item = config.generate(i);\n var height = item.height;\n\n if (height !== undefined && isNumber(height)) {\n item = item.element;\n\n // The height isn't the same as predicted, compute positions again\n if (height !== this._itemHeights[i]) {\n this._itemHeights[i] = height;\n this._computePositions(i);\n this._scrollHeight = this._computeScrollHeight(i);\n }\n } else {\n height = this._itemHeights[i];\n }\n\n if (!item || item.nodeType !== 1) {\n throw new Error('Generator did not return a DOM Node for index: ' + i);\n }\n\n addClass(item, config.rowClassName || 'vrow');\n\n var top = this._itemPositions[i] + this._scrollPaddingTop;\n\n HyperList.mergeStyle(item, _defineProperty({\n position: 'absolute'\n }, config.horizontal ? 'left' : 'top', top + 'px'));\n\n return item;\n }\n }, {\n key: '_getScrollPosition',\n value: function _getScrollPosition() {\n var config = this._config;\n\n if (typeof config.overrideScrollPosition === 'function') {\n return config.overrideScrollPosition();\n }\n\n return this._element[config.horizontal ? 'scrollLeft' : 'scrollTop'];\n }\n }, {\n key: '_renderChunk',\n value: function _renderChunk(force) {\n var config = this._config;\n var element = this._element;\n var scrollTop = this._getScrollPosition();\n var total = config.total;\n\n var from = config.reverse ? this._getReverseFrom(scrollTop) : this._getFrom(scrollTop) - 1;\n\n if (from < 0 || from - this._screenItemsLen < 0) {\n from = 0;\n }\n\n if (!force && this._lastFrom === from) {\n return false;\n }\n\n this._lastFrom = from;\n\n var to = from + this._cachedItemsLen;\n\n if (to > total || to + this._cachedItemsLen > total) {\n to = total;\n }\n\n // Append all the new rows in a document fragment that we will later append\n // to the parent node\n var fragment = config.useFragment ? document.createDocumentFragment() : []\n // Sometimes you'll pass fake elements to this tool and Fragments require\n // real elements.\n\n\n // The element that forces the container to scroll.\n ;var scroller = this._scroller;\n\n // Keep the scroller in the list of children.\n fragment[config.useFragment ? 'appendChild' : 'push'](scroller);\n\n for (var i = from; i < to; i++) {\n var row = this._getRow(i);\n\n fragment[config.useFragment ? 'appendChild' : 'push'](row);\n }\n\n if (config.applyPatch) {\n return config.applyPatch(element, fragment);\n }\n\n element.innerHTML = '';\n element.appendChild(fragment);\n }\n }, {\n key: '_computePositions',\n value: function _computePositions() {\n var from = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 1;\n\n var config = this._config;\n var total = config.total;\n var reverse = config.reverse;\n\n if (from < 1 && !reverse) {\n from = 1;\n }\n\n for (var i = from; i < total; i++) {\n if (reverse) {\n if (i === 0) {\n this._itemPositions[0] = this._scrollHeight - this._itemHeights[0];\n } else {\n this._itemPositions[i] = this._itemPositions[i - 1] - this._itemHeights[i];\n }\n } else {\n this._itemPositions[i] = this._itemHeights[i - 1] + this._itemPositions[i - 1];\n }\n }\n }\n }, {\n key: '_computeScrollHeight',\n value: function _computeScrollHeight() {\n var _HyperList$mergeStyle2,\n _this2 = this;\n\n var config = this._config;\n var isHoriz = Boolean(config.horizontal);\n var total = config.total;\n var scrollHeight = this._itemHeights.reduce(function (a, b) {\n return a + b;\n }, 0) + this._scrollPaddingBottom + this._scrollPaddingTop;\n\n HyperList.mergeStyle(this._scroller, (_HyperList$mergeStyle2 = {\n opacity: 0,\n position: 'absolute',\n top: '0px'\n }, _defineProperty(_HyperList$mergeStyle2, isHoriz ? 'height' : 'width', '1px'), _defineProperty(_HyperList$mergeStyle2, isHoriz ? 'width' : 'height', scrollHeight + 'px'), _HyperList$mergeStyle2));\n\n // Calculate the height median\n var sortedItemHeights = this._itemHeights.slice(0).sort(function (a, b) {\n return a - b;\n });\n var middle = Math.floor(total / 2);\n var averageHeight = total % 2 === 0 ? (sortedItemHeights[middle] + sortedItemHeights[middle - 1]) / 2 : sortedItemHeights[middle];\n\n var clientProp = isHoriz ? 'clientWidth' : 'clientHeight';\n var element = config.scrollContainer ? config.scrollContainer : this._element;\n var containerHeight = element[clientProp] ? element[clientProp] : this._containerSize;\n this._screenItemsLen = Math.ceil(containerHeight / averageHeight);\n this._containerSize = containerHeight;\n\n // Cache 3 times the number of items that fit in the container viewport.\n this._cachedItemsLen = Math.max(this._cachedItemsLen || 0, this._screenItemsLen * 3);\n this._averageHeight = averageHeight;\n\n if (config.reverse) {\n window.requestAnimationFrame(function () {\n if (isHoriz) {\n _this2._element.scrollLeft = scrollHeight;\n } else {\n _this2._element.scrollTop = scrollHeight;\n }\n });\n }\n\n return scrollHeight;\n }\n }, {\n key: '_computeScrollPadding',\n value: function _computeScrollPadding() {\n var config = this._config;\n var isHoriz = Boolean(config.horizontal);\n var isReverse = config.reverse;\n var styles = window.getComputedStyle(this._element);\n\n var padding = function padding(location) {\n var cssValue = styles.getPropertyValue('padding-' + location);\n return parseInt(cssValue, 10) || 0;\n };\n\n if (isHoriz && isReverse) {\n return {\n bottom: padding('left'),\n top: padding('right')\n };\n } else if (isHoriz) {\n return {\n bottom: padding('right'),\n top: padding('left')\n };\n } else if (isReverse) {\n return {\n bottom: padding('top'),\n top: padding('bottom')\n };\n } else {\n return {\n bottom: padding('bottom'),\n top: padding('top')\n };\n }\n }\n }, {\n key: '_getFrom',\n value: function _getFrom(scrollTop) {\n var i = 0;\n\n while (this._itemPositions[i] < scrollTop) {\n i++;\n }\n\n return i;\n }\n }, {\n key: '_getReverseFrom',\n value: function _getReverseFrom(scrollTop) {\n var i = this._config.total - 1;\n\n while (i > 0 && this._itemPositions[i] < scrollTop + this._containerSize) {\n i--;\n }\n\n return i;\n }\n }]);\n\n return HyperList;\n}();\n\nexports.default = HyperList;\nmodule.exports = exports['default'];\n\n},{}]},{},[1])(1)\n});\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n:host {\n display: block;\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Prop,\n Watch,\n} from '@stencil/core';\nimport Hyperlist from 'hyperlist';\nimport { renderDefaultItem } from '../tree-item/default-tree-item';\nimport {\n TreeContext,\n TreeItem,\n TreeItemContext,\n TreeItemVisual,\n TreeModel,\n UpdateCallback,\n} from './tree-model';\n\n@Component({\n tag: 'ix-tree',\n styleUrl: 'tree.css',\n shadow: true,\n})\nexport class Tree {\n @Element() hostElement!: HTMLIxTreeElement;\n\n /**\n * Initial root element will not be rendered\n */\n @Prop() root: string;\n\n /**\n * Tree model\n */\n @Prop() model: TreeModel<any>;\n\n /**\n * Render function of tree items\n */\n @Prop() renderItem: <T = any>(\n index: number,\n data: T,\n dataList: Array<T>,\n context: TreeContext,\n update: (callback: UpdateCallback) => void\n ) => HTMLElement;\n\n /**\n * Selection and collapsed state management\n */\n @Prop({ mutable: true }) context: TreeContext = {};\n\n /**\n * Context changed\n */\n @Event() contextChange: EventEmitter<TreeContext>;\n\n /**\n * Node toggled event\n * @since 1.5.0\n */\n @Event() nodeToggled: EventEmitter<{ id: string; isExpaned: boolean }>;\n\n /**\n * Node clicked event\n * @since 1.5.0\n */\n @Event() nodeClicked: EventEmitter<string>;\n\n /**\n * Emits removed nodes\n */\n @Event() nodeRemoved: EventEmitter<any>;\n\n private hyperlist: Hyperlist;\n\n private toggleListener = new Map<HTMLElement, Function>();\n private itemClickListener = new Map<HTMLElement, Function>();\n private updates = new Map<string, UpdateCallback>();\n private observer: MutationObserver;\n private hasFirstRender = false;\n\n private updatePadding(element: HTMLElement, item: TreeItemVisual<unknown>) {\n element.style.paddingLeft = item.level + 'rem';\n }\n\n private getVirtualizerOptions() {\n const list = this.buildTreeList(this.model[this.root]);\n\n let setToggleListener = (\n item: TreeItemVisual<any>,\n el: HTMLElement,\n index: number\n ) => {\n if (item.hasChildren && !this.toggleListener.has(el)) {\n const toggleCallback = (e: Event) => {\n e.preventDefault();\n e.stopPropagation();\n const context = this.getContext(list[index].id);\n context.isExpanded = !context.isExpanded;\n this.nodeToggled.emit({ id: item.id, isExpaned: context.isExpanded });\n this.setContext(item.id, context);\n };\n el.addEventListener('toggle', toggleCallback);\n this.toggleListener.set(el, toggleCallback);\n }\n };\n\n return {\n itemHeight: 32,\n total: list.length,\n generate: (index: number) => {\n const item = list[index];\n\n const renderedTreeItem = this.hostElement.querySelector(\n `[data-tree-node-id=\"${item.id}\"]`\n ) as HTMLIxTreeItemElement;\n\n const context = this.getContext(item.id);\n\n if (renderedTreeItem) {\n renderedTreeItem.hasChildren = item.hasChildren;\n renderedTreeItem.context = { ...context };\n\n setToggleListener(item, renderedTreeItem, index);\n\n if (this.updates.has(item.id)) {\n const doUpdate = this.updates.get(item.id);\n doUpdate(item, { ...this.context });\n }\n\n this.updatePadding(renderedTreeItem, item);\n return renderedTreeItem;\n }\n\n const update = (callback: UpdateCallback) => {\n this.updates.set(item.id, callback);\n };\n\n let innerElement: HTMLElement | null = null;\n if (this.renderItem) {\n innerElement = this.renderItem(\n index,\n item,\n list,\n { ...this.context },\n update\n );\n }\n\n if (innerElement === null) {\n innerElement = renderDefaultItem(item, context, update);\n }\n\n const el = innerElement;\n el.setAttribute('data-tree-node-id', item.id);\n el.style.paddingRight = '1rem';\n this.updatePadding(el, item);\n\n if (!this.itemClickListener.has(el)) {\n const itemClickCallback = (e: Event) => {\n e.preventDefault();\n e.stopPropagation();\n Object.values(this.context).forEach((c) => (c.isSelected = false));\n const context = this.getContext(item.id);\n context.isSelected = true;\n this.setContext(item.id, context);\n this.nodeClicked.emit(item.id);\n };\n el.addEventListener('itemClick', itemClickCallback);\n this.itemClickListener.set(el, itemClickCallback);\n }\n\n setToggleListener(item, el, index);\n\n return el;\n },\n };\n }\n\n private setContext(id: string, context: TreeItemContext) {\n this.context = {\n ...this.context,\n [id]: context,\n };\n\n this.contextChange.emit(this.context);\n }\n\n private getContext(id: string): TreeItemContext {\n if (!this.context) {\n return {\n isExpanded: false,\n isSelected: false,\n };\n }\n if (!this.context[id]) {\n this.context[id] = {\n isExpanded: false,\n isSelected: false,\n };\n }\n return this.context[id];\n }\n\n private buildTreeList(\n root: TreeItem<any>,\n level: number = 0\n ): TreeItemVisual<any>[] {\n const itemList: TreeItemVisual<any>[] = [];\n\n if (root?.hasChildren) {\n const newLevel = level + 1;\n root.children.forEach((id: string) => {\n const item = this.model[id];\n const context = this.getContext(id);\n itemList.push({ ...item, level });\n if (item.hasChildren && context.isExpanded) {\n itemList.push(...this.buildTreeList(item, newLevel));\n }\n });\n }\n\n return itemList;\n }\n\n componentDidLoad() {\n this.initList();\n\n this.observer = new MutationObserver((records) => {\n let removed = [];\n\n records.forEach((record) => {\n removed = [...removed, ...Array.from(record.removedNodes)];\n\n record.addedNodes.forEach((an) => {\n const index = removed.indexOf(an);\n if (index >= 0) {\n removed.splice(index, 1);\n }\n });\n });\n\n this.nodeRemoved.emit(removed);\n });\n\n this.observer.observe(this.hostElement, {\n childList: true,\n });\n }\n\n componentWillRender() {\n this.hasFirstRender = true;\n\n if (this.isListInitialized()) {\n this.refreshList();\n } else {\n this.initList();\n }\n }\n\n disconnectedCallback() {\n this.hyperlist?.destroy();\n this.observer?.disconnect();\n }\n\n @Watch('model')\n modelChange() {\n if (this.hasFirstRender && !this.isListInitialized()) {\n this.initList();\n }\n }\n\n private isListInitialized() {\n const itemPositions = this.hyperlist?._itemPositions;\n\n return (\n itemPositions !== undefined &&\n itemPositions.length &&\n !itemPositions?.some(\n (item: number) => item === undefined || Number.isNaN(item)\n )\n );\n }\n\n private refreshList() {\n if (this.hyperlist) {\n this.hyperlist.refresh(this.hostElement, this.getVirtualizerOptions());\n }\n }\n\n private initList() {\n if (!this.model) {\n return;\n }\n\n this.hyperlist?.destroy();\n const config = this.getVirtualizerOptions();\n this.hyperlist = new Hyperlist(this.hostElement, config);\n }\n\n render() {\n return (\n <Host>\n <slot></slot>\n </Host>\n );\n }\n}\n"],"mappings":"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"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{r as e,h as t,H as i}from"./p-76a509c7.js";const o=":host{display:flex;flex-grow:1;height:2.5rem;border-radius:var(--theme-kpi--border-radius);padding:0.375rem 0.25rem;min-width:0}: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 span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host .kpi-container{display:flex;height:100%;width:100%;border-block-end:2px solid grey}:host .kpi-container.alarm{border-block-end-color:var(--theme-color-alarm)}:host .kpi-container.warning{border-block-end-color:var(--theme-color-warning)}:host .kpi-container .kpi-label{display:flex;align-items:center;color:var(--theme-kpi-display-label--color);flex-grow:1;flex-shrink:9999}:host .kpi-container .kpi-label ix-icon{margin-inline-end:0.25rem}:host .kpi-container .kpi-value-container{display:flex;align-items:flex-end}:host .kpi-container .kpi-value{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1.375rem;font-weight:400;line-height:1.091em;color:var(--theme-color-std-text);color:var(--theme-kpi-display-value--color)}:host .kpi-container .kpi-unit{margin-inline-start:0.5rem;color:var(--theme-kpi-display-units--color)}:host .kpi-container .kpi-label,:host .kpi-container .kpi-unit{margin-block-start:0.125rem}:host:not(.disabled):not(:disabled){cursor:pointer}:host:not(.disabled):not(:disabled):hover{background-color:var(--theme-kpi-display--background--hover)}:host:not(.disabled):not(:disabled){cursor:pointer}:host:not(.disabled):not(:disabled):active,:host:not(.disabled):not(:disabled).active{background-color:var(--theme-kpi-display--background--active)}:host:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--focus--border-color)}:host(.stacked){height:3.75rem}:host(.stacked) .kpi-container{justify-content:center;flex-wrap:wrap}:host(.stacked) .kpi-container .kpi-label{width:100%;justify-content:center}";const r=class{constructor(t){e(this,t);this.label=undefined;this.value=undefined;this.unit=undefined;this.state="neutral";this.orientation="horizontal"}getStateIcon(){switch(this.state){case"alarm":return t("ix-icon",{color:"kpi-display-icon--color",name:"alarm",size:"16"});case"warning":return t("ix-icon",{color:"kpi-display-icon--color",name:"warning",size:"16"});default:return""}}getTooltipText(){let e=`${this.label}: ${this.value}`;if(this.unit){e=e.concat(` ${this.unit}`)}return e}render(){return t(i,{title:this.getTooltipText(),tabindex:"1",class:{stacked:this.orientation==="vertical"}},t("div",{class:{"kpi-container":true,alarm:this.state==="alarm",warning:this.state==="warning"}},t("span",{class:"kpi-label"},this.getStateIcon(),t("span",{class:"kpi-label-text"},this.label)),t("span",{class:"kpi-value-container"},t("span",{class:"kpi-value"},this.value),this.unit?t("span",{class:"kpi-unit"},this.unit):"")))}};r.style=o;export{r as ix_kpi};
|
|
2
|
+
//# sourceMappingURL=p-9594dcfb.entry.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["kpiCss","Kpi","getStateIcon","this","state","h","color","name","size","getTooltipText","tooltip","label","value","unit","concat","render","Host","title","tabindex","class","stacked","orientation","alarm","warning"],"sources":["./src/components/kpi/kpi.scss?tag=ix-kpi&encapsulation=shadow","./src/components/kpi/kpi.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@import 'mixins/shadow-dom/component';\n\n:host {\n @include ix-component;\n\n display: flex;\n flex-grow: 1;\n height: $large-control-height;\n border-radius: var(--theme-kpi--border-radius);\n padding: 0.375rem $tiny-space;\n min-width: 0;\n\n span {\n @include ellipsis;\n }\n\n .kpi-container {\n display: flex;\n height: 100%;\n width: 100%;\n border-block-end: 2px solid grey;\n\n &.alarm {\n border-block-end-color: var(--theme-color-alarm);\n }\n\n &.warning {\n border-block-end-color: var(--theme-color-warning);\n }\n\n .kpi-label {\n display: flex;\n align-items: center;\n color: var(--theme-kpi-display-label--color);\n flex-grow: 1;\n flex-shrink: 9999;\n\n ix-icon {\n margin-inline-end: $tiny-space;\n }\n }\n\n .kpi-value-container {\n display: flex;\n align-items: flex-end;\n }\n\n .kpi-value {\n @include text-xl;\n\n color: var(--theme-kpi-display-value--color);\n }\n\n .kpi-unit {\n margin-inline-start: $small-space;\n color: var(--theme-kpi-display-units--color);\n }\n\n .kpi-label,\n .kpi-unit {\n margin-block-start: 0.125rem;\n }\n }\n\n @include hover {\n background-color: var(--theme-kpi-display--background--hover);\n }\n\n @include active {\n background-color: var(--theme-kpi-display--background--active);\n }\n\n @include focus-visible {\n outline: 1px solid var(--focus--border-color);\n }\n}\n\n:host(.stacked) {\n height: 3.75rem;\n\n .kpi-container {\n justify-content: center;\n flex-wrap: wrap;\n\n .kpi-label {\n width: 100%;\n justify-content: center;\n }\n }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Component, h, Host, Prop } from '@stencil/core';\n\n@Component({\n tag: 'ix-kpi',\n styleUrl: 'kpi.scss',\n shadow: true,\n})\nexport class Kpi {\n /**\n *\n */\n @Prop() label: string;\n\n /**\n *\n */\n @Prop() value: string | number;\n\n /**\n *\n */\n @Prop() unit: string;\n\n /**\n *\n */\n @Prop() state: 'neutral' | 'warning' | 'alarm' = 'neutral';\n\n /**\n *\n */\n @Prop() orientation: 'horizontal' | 'vertical' = 'horizontal';\n\n private getStateIcon() {\n switch (this.state) {\n case 'alarm':\n return (\n <ix-icon\n color=\"kpi-display-icon--color\"\n name={'alarm'}\n size=\"16\"\n ></ix-icon>\n );\n\n case 'warning':\n return (\n <ix-icon\n color=\"kpi-display-icon--color\"\n name={'warning'}\n size=\"16\"\n ></ix-icon>\n );\n\n default:\n return '';\n }\n }\n\n private getTooltipText() {\n let tooltip = `${this.label}: ${this.value}`;\n\n if (this.unit) {\n tooltip = tooltip.concat(` ${this.unit}`);\n }\n\n return tooltip;\n }\n\n render() {\n return (\n <Host\n title={this.getTooltipText()}\n tabindex=\"1\"\n class={{\n stacked: this.orientation === 'vertical',\n }}\n >\n <div\n class={{\n 'kpi-container': true,\n alarm: this.state === 'alarm',\n warning: this.state === 'warning',\n }}\n >\n <span class=\"kpi-label\">\n {this.getStateIcon()}\n <span class=\"kpi-label-text\">{this.label}</span>\n </span>\n <span class=\"kpi-value-container\">\n <span class=\"kpi-value\">{this.value}</span>\n {this.unit ? <span class=\"kpi-unit\">{this.unit}</span> : ''}\n </span>\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"kDAAA,MAAMA,EAAS,
|
|
1
|
+
{"version":3,"names":["kpiCss","Kpi","getStateIcon","this","state","h","color","name","size","getTooltipText","tooltip","label","value","unit","concat","render","Host","title","tabindex","class","stacked","orientation","alarm","warning"],"sources":["./src/components/kpi/kpi.scss?tag=ix-kpi&encapsulation=shadow","./src/components/kpi/kpi.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@import 'mixins/shadow-dom/component';\n\n:host {\n @include ix-component;\n\n display: flex;\n flex-grow: 1;\n height: $large-control-height;\n border-radius: var(--theme-kpi--border-radius);\n padding: 0.375rem $tiny-space;\n min-width: 0;\n\n span {\n @include ellipsis;\n }\n\n .kpi-container {\n display: flex;\n height: 100%;\n width: 100%;\n border-block-end: 2px solid grey;\n\n &.alarm {\n border-block-end-color: var(--theme-color-alarm);\n }\n\n &.warning {\n border-block-end-color: var(--theme-color-warning);\n }\n\n .kpi-label {\n display: flex;\n align-items: center;\n color: var(--theme-kpi-display-label--color);\n flex-grow: 1;\n flex-shrink: 9999;\n\n ix-icon {\n margin-inline-end: $tiny-space;\n }\n }\n\n .kpi-value-container {\n display: flex;\n align-items: flex-end;\n }\n\n .kpi-value {\n @include text-xl;\n\n color: var(--theme-kpi-display-value--color);\n }\n\n .kpi-unit {\n margin-inline-start: $small-space;\n color: var(--theme-kpi-display-units--color);\n }\n\n .kpi-label,\n .kpi-unit {\n margin-block-start: 0.125rem;\n }\n }\n\n @include hover {\n background-color: var(--theme-kpi-display--background--hover);\n }\n\n @include active {\n background-color: var(--theme-kpi-display--background--active);\n }\n\n @include focus-visible {\n outline: 1px solid var(--focus--border-color);\n }\n}\n\n:host(.stacked) {\n height: 3.75rem;\n\n .kpi-container {\n justify-content: center;\n flex-wrap: wrap;\n\n .kpi-label {\n width: 100%;\n justify-content: center;\n }\n }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Component, h, Host, Prop } from '@stencil/core';\n\n@Component({\n tag: 'ix-kpi',\n styleUrl: 'kpi.scss',\n shadow: true,\n})\nexport class Kpi {\n /**\n *\n */\n @Prop() label: string;\n\n /**\n *\n */\n @Prop() value: string | number;\n\n /**\n *\n */\n @Prop() unit: string;\n\n /**\n *\n */\n @Prop() state: 'neutral' | 'warning' | 'alarm' = 'neutral';\n\n /**\n *\n */\n @Prop() orientation: 'horizontal' | 'vertical' = 'horizontal';\n\n private getStateIcon() {\n switch (this.state) {\n case 'alarm':\n return (\n <ix-icon\n color=\"kpi-display-icon--color\"\n name={'alarm'}\n size=\"16\"\n ></ix-icon>\n );\n\n case 'warning':\n return (\n <ix-icon\n color=\"kpi-display-icon--color\"\n name={'warning'}\n size=\"16\"\n ></ix-icon>\n );\n\n default:\n return '';\n }\n }\n\n private getTooltipText() {\n let tooltip = `${this.label}: ${this.value}`;\n\n if (this.unit) {\n tooltip = tooltip.concat(` ${this.unit}`);\n }\n\n return tooltip;\n }\n\n render() {\n return (\n <Host\n title={this.getTooltipText()}\n tabindex=\"1\"\n class={{\n stacked: this.orientation === 'vertical',\n }}\n >\n <div\n class={{\n 'kpi-container': true,\n alarm: this.state === 'alarm',\n warning: this.state === 'warning',\n }}\n >\n <span class=\"kpi-label\">\n {this.getStateIcon()}\n <span class=\"kpi-label-text\">{this.label}</span>\n </span>\n <span class=\"kpi-value-container\">\n <span class=\"kpi-value\">{this.value}</span>\n {this.unit ? <span class=\"kpi-unit\">{this.unit}</span> : ''}\n </span>\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"kDAAA,MAAMA,EAAS,62E,MCgBFC,EAAG,M,kGAmBmC,U,iBAKA,Y,CAEzCC,eACN,OAAQC,KAAKC,OACX,IAAK,QACH,OACEC,EAAA,WACEC,MAAM,0BACNC,KAAM,QACNC,KAAK,OAIX,IAAK,UACH,OACEH,EAAA,WACEC,MAAM,0BACNC,KAAM,UACNC,KAAK,OAIX,QACE,MAAO,G,CAILC,iBACN,IAAIC,EAAU,GAAGP,KAAKQ,UAAUR,KAAKS,QAErC,GAAIT,KAAKU,KAAM,CACbH,EAAUA,EAAQI,OAAO,IAAIX,KAAKU,O,CAGpC,OAAOH,C,CAGTK,SACE,OACEV,EAACW,EAAI,CACHC,MAAOd,KAAKM,iBACZS,SAAS,IACTC,MAAO,CACLC,QAASjB,KAAKkB,cAAgB,aAGhChB,EAAA,OACEc,MAAO,CACL,gBAAiB,KACjBG,MAAOnB,KAAKC,QAAU,QACtBmB,QAASpB,KAAKC,QAAU,YAG1BC,EAAA,QAAMc,MAAM,aACThB,KAAKD,eACNG,EAAA,QAAMc,MAAM,kBAAkBhB,KAAKQ,QAErCN,EAAA,QAAMc,MAAM,uBACVd,EAAA,QAAMc,MAAM,aAAahB,KAAKS,OAC7BT,KAAKU,KAAOR,EAAA,QAAMc,MAAM,YAAYhB,KAAKU,MAAe,K"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{r as t,c as i,h as s,H as e,g as r}from"./p-76a509c7.js";import{f as h,i as o,s as n,o as a,a as c,c as d}from"./p-00df4a8c.js";import{O as l}from"./p-b59e7155.js";const u=":host{background-color:var(--theme-color-2);border-radius:var(--theme-default-border-radius);min-width:0px;z-index:var(--theme-z-index-dropdown);box-shadow:var(--theme-shadow-4);padding:0.25rem 0px}: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 .dropdown-header{display:flex;align-items:center;height:2.5rem;color:var(--theme-menu-header--color);padding:0 1rem}:host(.overflow){max-height:50vh;overflow-y:auto}:host(:not(.show)){display:none}";var f=undefined&&undefined.__decorate||function(t,i,s,e){var r=arguments.length,h=r<3?i:e===null?e=Object.getOwnPropertyDescriptor(i,s):e,o;if(typeof Reflect==="object"&&typeof Reflect.decorate==="function")h=Reflect.decorate(t,i,s,e);else for(var n=t.length-1;n>=0;n--)if(o=t[n])h=(r<3?o(h):r>3?o(i,s,h):o(i,s))||h;return r>3&&h&&Object.defineProperty(i,s,h),h};const b=new Map;let w=0;const m=class{constructor(s){t(this,s);this.showChanged=i(this,"showChanged",7);this.autoUpdateCleanup=null;this.localUId=`dropdown-${w++}-${(new Date).valueOf()}`;this.suppressAutomaticPlacement=false;this.show=false;this.trigger=undefined;this.anchor=undefined;this.closeBehavior="both";this.placement="bottom-start";this.positioningStrategy="fixed";this.header=undefined;this.offset=undefined;this.triggerEvent="click";this.overwriteDropdownStyle=undefined;this.toggleBind=this.toggle.bind(this);this.openBind=this.open.bind(this);if(b.has(this.localUId)){console.warn("Dropdown with duplicated id detected")}b.set(this.localUId,{dispose:this.close.bind(this),element:this.hostElement,child:null});const e=this.closestPassShadow(this.hostElement.parentNode,"ix-dropdown");if(e){for(let t of b.values()){if(t.element===e){t.child=this.hostElement}}}}closestPassShadow(t,i){if(!t){return null}if(t instanceof ShadowRoot){return this.closestPassShadow(t.host,i)}if(t instanceof HTMLElement){if(t.matches(i)){return t}else{return this.closestPassShadow(t.parentNode,i)}}return this.closestPassShadow(t.parentNode,i)}get dropdownItems(){return Array.from(this.hostElement.querySelectorAll("ix-dropdown-item"))}get slotElement(){return this.hostElement.shadowRoot.querySelector("slot")}addEventListenersFor(t){switch(t){case"click":this.triggerElement.addEventListener("click",this.openBind);break;case"hover":this.triggerElement.addEventListener("mouseenter",this.openBind);break;case"focus":this.triggerElement.addEventListener("focusin",this.openBind);break}}removeEventListenersFor(t,i){switch(t){case"click":if(this.closeBehavior==="outside"){i.removeEventListener("click",this.openBind)}else{i.removeEventListener("click",this.toggleBind)}break;case"hover":i.removeEventListener("mouseenter",this.openBind);break;case"focus":i.removeEventListener("focusin",this.openBind);break}}async registerListener(t){this.triggerElement=await this.resolveElement(t);if(this.triggerElement){if(Array.isArray(this.triggerEvent)){this.triggerEvent.forEach((t=>{this.addEventListenersFor(t)}))}else{this.addEventListenersFor(this.triggerEvent)}}}async unregisterListener(t){const i=await this.resolveElement(t);if(Array.isArray(this.triggerEvent)){this.triggerEvent.forEach((t=>{this.removeEventListenersFor(t,i)}))}else{this.removeEventListenersFor(this.triggerEvent,i)}}resolveElement(t){if(typeof t!=="string"){return Promise.resolve(t)}const i=`#${t}`;return new Promise((t=>{if(document.querySelector(i)){return t(document.querySelector(i))}const s=new MutationObserver((()=>{if(document.querySelector(i)){t(document.querySelector(i));s.disconnect()}}));s.observe(document.body,{childList:true,subtree:true})}))}async changedShow(t){if(t){this.anchorElement=await(this.anchor?this.resolveElement(this.anchor):this.resolveElement(this.trigger));if(this.anchorElement){this.applyDropdownPosition()}}if(t){b.forEach(((t,i)=>{if(i!==this.localUId&&!this.isAnchorSubmenu()&&t.child!==this.hostElement){t.dispose()}}))}}changedTrigger(t,i){if(t){this.registerListener(t)}if(i){this.unregisterListener(i)}}clickOutside(t){var i,s;const e=t.target;if(t.defaultPrevented){return}if(this.show===false||this.closeBehavior===false||((i=this.anchorElement)===null||i===void 0?void 0:i.contains(e))||((s=this.triggerElement)===null||s===void 0?void 0:s.contains(e))){return}const r=this.isClickInsideDropdown(t);switch(this.closeBehavior){case"outside":if(!r||this.anchor===e){this.close()}break;case"inside":if(r&&this.hostElement!==e){this.close()}break;case"both":if(this.hostElement!==e){this.close()}break;default:this.close()}}keydown(t){if(this.show===true&&t.code==="Escape"){this.close()}}isNestedDropdown(t){return t.closest("ix-dropdown")}isAnchorSubmenu(){var t;const i=(t=this.anchorElement)===null||t===void 0?void 0:t.closest("ix-dropdown-item");if(!i){return false}return true}toggle(t){t.preventDefault();if(this.isNestedDropdown(t.target)){t.stopPropagation()}const{defaultPrevented:i}=this.showChanged.emit(this.show);if(!i){this.show=!this.show}}open(t){t.preventDefault();if(this.isNestedDropdown(t.target)){t.stopPropagation()}const{defaultPrevented:i}=this.showChanged.emit(true);if(!i){this.show=true}}close(){const{defaultPrevented:t}=this.showChanged.emit(false);if(!t){this.show=false}}async applyDropdownPosition(){if(!this.anchorElement){return}if(!this.dropdownRef){return}const t=this.isAnchorSubmenu();let i={strategy:this.positioningStrategy,middleware:[]};if(!this.suppressAutomaticPlacement){i.middleware.push(h({fallbackStrategy:"initialPlacement"}))}i.placement=t?"right-start":this.placement;i.middleware=[...i.middleware,o(),n()];if(this.offset){i.middleware.push(a(this.offset))}if(this.autoUpdateCleanup){this.autoUpdateCleanup();this.autoUpdateCleanup=null}this.autoUpdateCleanup=c(this.anchorElement,this.dropdownRef,(async()=>{const t=await d(this.anchorElement,this.dropdownRef,i);Object.assign(this.dropdownRef.style,{top:"0",left:"0",transform:`translate(${Math.round(t.x)}px,${Math.round(t.y)}px)`});if(this.overwriteDropdownStyle){const t=await this.overwriteDropdownStyle({dropdownRef:this.dropdownRef,triggerRef:this.triggerElement});Object.assign(this.dropdownRef.style,t)}}),{ancestorResize:true,ancestorScroll:true,elementResize:true})}async componentDidLoad(){this.changedTrigger(this.trigger,null)}async componentDidRender(){var t;await this.applyDropdownPosition();this.anchorElement=await(this.anchor?this.resolveElement(this.anchor):this.resolveElement(this.trigger));if(this.isAnchorSubmenu()&&((t=this.anchorElement)===null||t===void 0?void 0:t.tagName)==="IX-DROPDOWN-ITEM"){this.anchorElement.isSubMenu=true}}isClickInsideDropdown(t){const i=this.dropdownRef.getBoundingClientRect();return i.top<=t.clientY&&t.clientY<=i.top+i.height&&i.left<=t.clientX&&t.clientX<=i.left+i.width}disconnectedCallback(){if(this.autoUpdateCleanup){this.autoUpdateCleanup()}if(b.has(this.localUId)){b.delete(this.localUId)}}async updatePosition(){this.applyDropdownPosition()}render(){return s(e,{ref:t=>this.dropdownRef=t,class:{"dropdown-menu":true,show:this.show,overflow:true},style:{margin:"0",minWidth:"0px",position:this.positioningStrategy},role:"list"},s("div",{style:{display:"contents"}},this.header?s("div",{class:"dropdown-header"},this.header):"",s("slot",null)))}get hostElement(){return r(this)}static get watchers(){return{show:["changedShow"],trigger:["changedTrigger"]}}};f([l("click",(t=>t.show))],m.prototype,"clickOutside",null);f([l("keydown",(t=>t.show))],m.prototype,"keydown",null);m.style=u;export{m as ix_dropdown};
|
|
2
|
+
//# sourceMappingURL=p-9dda017b.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["dropdownCss","dropdownDisposer","Map","sequenceId","Dropdown","constructor","hostRef","this","autoUpdateCleanup","localUId","Date","valueOf","toggleBind","toggle","bind","openBind","open","has","console","warn","set","dispose","close","element","hostElement","child","parentDropdown","closestPassShadow","parentNode","entry","values","node","selector","ShadowRoot","host","HTMLElement","matches","dropdownItems","Array","from","querySelectorAll","slotElement","shadowRoot","querySelector","addEventListenersFor","triggerEvent","triggerElement","addEventListener","removeEventListenersFor","closeBehavior","removeEventListener","async","resolveElement","isArray","forEach","trigger","Promise","resolve","document","observer","MutationObserver","disconnect","observe","body","childList","subtree","newShow","anchorElement","anchor","applyDropdownPosition","id","isAnchorSubmenu","changedTrigger","newTriggerValue","oldTriggerValue","registerListener","unregisterListener","clickOutside","event","target","defaultPrevented","show","_a","contains","_b","clickInsideDropdown","isClickInsideDropdown","keydown","code","isNestedDropdown","closest","preventDefault","stopPropagation","showChanged","emit","dropdownRef","isSubmenu","positionConfig","strategy","positioningStrategy","middleware","suppressAutomaticPlacement","push","flip","fallbackStrategy","placement","inline","shift","offset","autoUpdate","computeResponse","computePosition","Object","assign","style","top","left","transform","Math","round","x","y","overwriteDropdownStyle","overwriteStyle","triggerRef","ancestorResize","ancestorScroll","elementResize","tagName","isSubMenu","rect","getBoundingClientRect","clientY","height","clientX","width","disconnectedCallback","delete","render","h","Host","ref","class","overflow","margin","minWidth","position","role","display","header","__decorate","OnListener","self"],"sources":["./src/components/dropdown/dropdown.scss?tag=ix-dropdown&encapsulation=shadow","./src/components/dropdown/dropdown.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@import 'common-variables';\n\n@import 'legacy/mixins/fonts';\n@import 'mixins/text-truncation';\n@import 'mixins/shadow-dom/component';\n\n:host {\n background-color: var(--theme-color-2);\n border-radius: var(--theme-default-border-radius);\n @include ix-component;\n min-width: 0px;\n z-index: var(--theme-z-index-dropdown);\n box-shadow: var(--theme-shadow-4);\n\n padding: 0.25rem 0px;\n\n .dropdown-header {\n display: flex;\n align-items: center;\n height: $large-control-height;\n color: var(--theme-menu-header--color);\n padding: 0 $default-space;\n }\n}\n\n:host(.overflow) {\n max-height: 50vh;\n overflow-y: auto;\n}\n\n:host(:not(.show)) {\n display: none;\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n autoUpdate,\n computePosition,\n ComputePositionConfig,\n flip,\n inline,\n offset,\n shift,\n} from '@floating-ui/dom';\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Method,\n Prop,\n Watch,\n} from '@stencil/core';\nimport { OnListener } from '../utils/listener';\nimport { AlignedPlacement } from './placement';\n\n/**\n * @internal\n */\nexport type DropdownTriggerEvent = 'click' | 'hover' | 'focus';\n\ntype DisposeDropdown = () => void;\ntype DropdownDisposerEntry = {\n element: HTMLIxDropdownElement;\n child: HTMLIxDropdownElement;\n dispose: DisposeDropdown;\n};\nconst dropdownDisposer = new Map<string, DropdownDisposerEntry>();\nlet sequenceId = 0;\n\n@Component({\n tag: 'ix-dropdown',\n styleUrl: 'dropdown.scss',\n shadow: true,\n})\nexport class Dropdown {\n @Element() hostElement!: HTMLIxDropdownElement;\n\n /**\n * Suppress the automatic placement of the dropdown.\n *\n * @since 2.0.0\n */\n @Prop() suppressAutomaticPlacement = false;\n\n /**\n * Show dropdown\n */\n @Prop({ mutable: true, reflect: true }) show = false;\n\n /**\n * Define an element that triggers the dropdown.\n * A trigger can either be a string that will be interpreted as id attribute or a DOM element.\n */\n @Prop() trigger: string | HTMLElement;\n\n /**\n * Define an anchor element\n */\n @Prop() anchor: string | HTMLElement;\n\n /**\n * Controls if the dropdown will be closed in response to a click event depending on the position of the event relative to the dropdown.\n */\n @Prop() closeBehavior: 'inside' | 'outside' | 'both' | boolean = 'both';\n\n /**\n * Placement of the dropdown\n */\n @Prop() placement: AlignedPlacement = 'bottom-start';\n\n /**\n * Position strategy\n */\n @Prop() positioningStrategy: 'absolute' | 'fixed' = 'fixed';\n\n /**\n * An optional header shown at the top of the dropdown\n */\n @Prop() header?: string;\n\n /**\n * Move dropdown along main axis of alignment\n *\n * @internal\n */\n @Prop() offset: {\n mainAxis?: number;\n crossAxis?: number;\n alignmentAxis?: number;\n };\n\n /**\n * Define one or more events to open dropdown\n * @internal\n */\n @Prop() triggerEvent: DropdownTriggerEvent | DropdownTriggerEvent[] = 'click';\n\n /**\n * @internal\n */\n @Prop() overwriteDropdownStyle: (delegate: {\n dropdownRef: HTMLElement;\n triggerRef?: HTMLElement;\n }) => Promise<Partial<CSSStyleDeclaration>>;\n\n /**\n * Fire event after visibility of dropdown has changed\n */\n @Event() showChanged: EventEmitter<boolean>;\n\n private autoUpdateCleanup: () => void = null;\n\n private triggerElement?: Element;\n private anchorElement?: Element;\n\n private dropdownRef: HTMLElement;\n\n private toggleBind: any;\n private openBind: any;\n\n private localUId = `dropdown-${sequenceId++}-${new Date().valueOf()}`;\n\n constructor() {\n this.toggleBind = this.toggle.bind(this);\n this.openBind = this.open.bind(this);\n\n if (dropdownDisposer.has(this.localUId)) {\n console.warn('Dropdown with duplicated id detected');\n }\n\n dropdownDisposer.set(this.localUId, {\n dispose: this.close.bind(this),\n element: this.hostElement,\n child: null,\n });\n\n const parentDropdown = this.closestPassShadow(\n this.hostElement.parentNode,\n 'ix-dropdown'\n );\n if (parentDropdown) {\n for (let entry of dropdownDisposer.values()) {\n if (entry.element === parentDropdown) {\n entry.child = this.hostElement;\n }\n }\n }\n }\n\n closestPassShadow(node, selector) {\n if (!node) {\n return null;\n }\n\n if (node instanceof ShadowRoot) {\n return this.closestPassShadow(node.host, selector);\n }\n\n if (node instanceof HTMLElement) {\n if (node.matches(selector)) {\n return node;\n } else {\n return this.closestPassShadow(node.parentNode, selector);\n }\n }\n\n return this.closestPassShadow(node.parentNode, selector);\n }\n\n get dropdownItems() {\n return Array.from(this.hostElement.querySelectorAll('ix-dropdown-item'));\n }\n\n get slotElement() {\n return this.hostElement.shadowRoot.querySelector('slot');\n }\n\n private addEventListenersFor(triggerEvent: DropdownTriggerEvent) {\n switch (triggerEvent) {\n case 'click':\n this.triggerElement.addEventListener('click', this.openBind);\n break;\n\n case 'hover':\n this.triggerElement.addEventListener('mouseenter', this.openBind);\n break;\n\n case 'focus':\n this.triggerElement.addEventListener('focusin', this.openBind);\n break;\n }\n }\n\n private removeEventListenersFor(\n triggerEvent: DropdownTriggerEvent,\n triggerElement: Element\n ) {\n switch (triggerEvent) {\n case 'click':\n if (this.closeBehavior === 'outside') {\n triggerElement.removeEventListener('click', this.openBind);\n } else {\n triggerElement.removeEventListener('click', this.toggleBind);\n }\n break;\n\n case 'hover':\n triggerElement.removeEventListener('mouseenter', this.openBind);\n break;\n\n case 'focus':\n triggerElement.removeEventListener('focusin', this.openBind);\n break;\n }\n }\n\n private async registerListener(element: string | HTMLElement) {\n this.triggerElement = await this.resolveElement(element);\n if (this.triggerElement) {\n if (Array.isArray(this.triggerEvent)) {\n this.triggerEvent.forEach((triggerEvent) => {\n this.addEventListenersFor(triggerEvent);\n });\n } else {\n this.addEventListenersFor(this.triggerEvent);\n }\n }\n }\n\n private async unregisterListener(element: string | HTMLElement) {\n const trigger = await this.resolveElement(element);\n if (Array.isArray(this.triggerEvent)) {\n this.triggerEvent.forEach((triggerEvent) => {\n this.removeEventListenersFor(triggerEvent, trigger);\n });\n } else {\n this.removeEventListenersFor(this.triggerEvent, trigger);\n }\n }\n\n private resolveElement(element: string | HTMLElement): Promise<Element> {\n if (typeof element !== 'string') {\n return Promise.resolve(element);\n }\n\n const selector = `#${element}`;\n return new Promise((resolve) => {\n if (document.querySelector(selector)) {\n return resolve(document.querySelector(selector));\n }\n\n const observer = new MutationObserver(() => {\n if (document.querySelector(selector)) {\n resolve(document.querySelector(selector));\n observer.disconnect();\n }\n });\n\n observer.observe(document.body, {\n childList: true,\n subtree: true,\n });\n });\n }\n\n @Watch('show')\n async changedShow(newShow: boolean) {\n if (newShow) {\n this.anchorElement = await (this.anchor\n ? this.resolveElement(this.anchor)\n : this.resolveElement(this.trigger));\n\n if (this.anchorElement) {\n this.applyDropdownPosition();\n }\n }\n\n if (newShow) {\n dropdownDisposer.forEach((entry, id) => {\n if (\n id !== this.localUId &&\n !this.isAnchorSubmenu() &&\n entry.child !== this.hostElement\n ) {\n entry.dispose();\n }\n });\n }\n }\n\n @Watch('trigger')\n changedTrigger(\n newTriggerValue: string | HTMLElement,\n oldTriggerValue: string | HTMLElement\n ) {\n if (newTriggerValue) {\n this.registerListener(newTriggerValue);\n }\n\n if (oldTriggerValue) {\n this.unregisterListener(oldTriggerValue);\n }\n }\n\n @OnListener<Dropdown>('click', (self) => self.show)\n clickOutside(event: PointerEvent) {\n const target = event.target as HTMLElement;\n\n if (event.defaultPrevented) {\n return;\n }\n\n if (\n this.show === false ||\n this.closeBehavior === false ||\n this.anchorElement?.contains(target) ||\n this.triggerElement?.contains(target)\n ) {\n return;\n }\n\n const clickInsideDropdown = this.isClickInsideDropdown(event);\n\n switch (this.closeBehavior) {\n case 'outside':\n if (!clickInsideDropdown || this.anchor === target) {\n this.close();\n }\n break;\n case 'inside':\n if (clickInsideDropdown && this.hostElement !== target) {\n this.close();\n }\n break;\n case 'both':\n if (this.hostElement !== target) {\n this.close();\n }\n break;\n default:\n this.close();\n }\n }\n\n @OnListener<Dropdown>('keydown', (self) => self.show)\n keydown(event: KeyboardEvent) {\n if (this.show === true && event.code === 'Escape') {\n this.close();\n }\n }\n\n private isNestedDropdown(element: Element) {\n return element.closest('ix-dropdown');\n }\n\n private isAnchorSubmenu() {\n const anchor = this.anchorElement?.closest('ix-dropdown-item');\n if (!anchor) {\n return false;\n }\n\n return true;\n }\n\n private toggle(event: Event) {\n event.preventDefault();\n\n if (this.isNestedDropdown(event.target as HTMLElement)) {\n event.stopPropagation();\n }\n\n const { defaultPrevented } = this.showChanged.emit(this.show);\n\n if (!defaultPrevented) {\n this.show = !this.show;\n }\n }\n\n private open(event: Event) {\n event.preventDefault();\n\n if (this.isNestedDropdown(event.target as HTMLElement)) {\n event.stopPropagation();\n }\n\n const { defaultPrevented } = this.showChanged.emit(true);\n\n if (!defaultPrevented) {\n this.show = true;\n }\n }\n\n private close() {\n const { defaultPrevented } = this.showChanged.emit(false);\n\n if (!defaultPrevented) {\n this.show = false;\n }\n }\n\n private async applyDropdownPosition() {\n if (!this.anchorElement) {\n return;\n }\n if (!this.dropdownRef) {\n return;\n }\n const isSubmenu = this.isAnchorSubmenu();\n\n let positionConfig: Partial<ComputePositionConfig> = {\n strategy: this.positioningStrategy,\n middleware: [],\n };\n\n if (!this.suppressAutomaticPlacement) {\n positionConfig.middleware.push(\n flip({ fallbackStrategy: 'initialPlacement' })\n );\n }\n\n positionConfig.placement = isSubmenu ? 'right-start' : this.placement;\n\n positionConfig.middleware = [\n ...positionConfig.middleware,\n inline(),\n shift(),\n ];\n\n if (this.offset) {\n positionConfig.middleware.push(offset(this.offset));\n }\n\n if (this.autoUpdateCleanup) {\n this.autoUpdateCleanup();\n this.autoUpdateCleanup = null;\n }\n\n this.autoUpdateCleanup = autoUpdate(\n this.anchorElement,\n this.dropdownRef,\n async () => {\n const computeResponse = await computePosition(\n this.anchorElement,\n this.dropdownRef,\n positionConfig\n );\n\n Object.assign(this.dropdownRef.style, {\n top: '0',\n left: '0',\n transform: `translate(${Math.round(computeResponse.x)}px,${Math.round(\n computeResponse.y\n )}px)`,\n });\n if (this.overwriteDropdownStyle) {\n const overwriteStyle = await this.overwriteDropdownStyle({\n dropdownRef: this.dropdownRef,\n triggerRef: this.triggerElement as HTMLElement,\n });\n\n Object.assign(this.dropdownRef.style, overwriteStyle);\n }\n },\n {\n ancestorResize: true,\n ancestorScroll: true,\n elementResize: true,\n }\n );\n }\n\n async componentDidLoad() {\n this.changedTrigger(this.trigger, null);\n }\n\n async componentDidRender() {\n await this.applyDropdownPosition();\n this.anchorElement = await (this.anchor\n ? this.resolveElement(this.anchor)\n : this.resolveElement(this.trigger));\n\n if (\n this.isAnchorSubmenu() &&\n this.anchorElement?.tagName === 'IX-DROPDOWN-ITEM'\n ) {\n (this.anchorElement as HTMLIxDropdownItemElement).isSubMenu = true;\n }\n }\n\n private isClickInsideDropdown(event: PointerEvent) {\n const rect = this.dropdownRef.getBoundingClientRect();\n return (\n rect.top <= event.clientY &&\n event.clientY <= rect.top + rect.height &&\n rect.left <= event.clientX &&\n event.clientX <= rect.left + rect.width\n );\n }\n\n disconnectedCallback() {\n if (this.autoUpdateCleanup) {\n this.autoUpdateCleanup();\n }\n\n if (dropdownDisposer.has(this.localUId)) {\n dropdownDisposer.delete(this.localUId);\n }\n }\n\n /**\n * Update position of dropdown\n */\n @Method()\n async updatePosition() {\n this.applyDropdownPosition();\n }\n\n render() {\n return (\n <Host\n ref={(ref) => (this.dropdownRef = ref)}\n class={{\n 'dropdown-menu': true,\n show: this.show,\n overflow: true,\n }}\n style={{\n margin: '0',\n minWidth: '0px',\n position: this.positioningStrategy,\n }}\n role=\"list\"\n >\n <div style={{ display: 'contents' }}>\n {this.header ? <div class=\"dropdown-header\">{this.header}</div> : ''}\n\n <slot></slot>\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{r as t,c as i,h as o,H as s,g as a}from"./p-76a509c7.js";import{a as e}from"./p-810b5232.js";import{b as l,a as r}from"./p-2fd30d79.js";import{A as n}from"./p-3b97bb69.js";const d="::backdrop{--ix-dialog-backdrop:var(--theme-color-lightbox, #0000008c)}:focus-visible{outline:none !important}:host dialog{margin:0;left:50%}:host dialog::backdrop{-webkit-backdrop-filter:blur(2.7182817459px);backdrop-filter:blur(2.7182817459px)}:host .modal{display:flex;flex-direction:column;position:relative;border:none;border-radius:var(--theme-default-border-radius);background:var(--theme-modal--background);box-shadow:var(--theme-shadow-4);color:var(--theme-color-std-text);overflow:visible;max-height:80vh;pointer-events:all}:host .modal-size-360{width:22.5rem}:host .modal-size-480{width:30rem}:host .modal-size-600{width:37.5rem}:host .modal-size-720{width:45rem}:host .modal-size-840{width:52.5rem}:host .modal-size-full-width{width:95%}:host .modal-size-full-screen{left:0px !important;top:0px !important;transform:none !important;width:calc(100% - 28px);min-width:calc(100% - 28px);max-width:calc(100% - 28px);height:calc(100% - 28px);min-height:calc(100% - 28px);max-height:calc(100% - 28px)}:host .dialog-backdrop{display:block;position:fixed;width:100vw;height:100vh;top:0px;left:0px;pointer-events:none}:host ::slotted(ix-modal-footer){margin-top:auto}:host(.align-center) dialog{margin:0;left:50%;top:50%}:host(.no-backdrop) dialog::backdrop{background-color:transparent !important;-webkit-backdrop-filter:none !important;backdrop-filter:none !important}:host(.with-icon) ::slotted(ix-modal-footer),:host(.with-icon) ::slotted(ix-modal-content){margin-left:2.5rem}";const h=class{constructor(o){t(this,o);this.dialogClose=i(this,"dialogClose",7);this.dialogDismiss=i(this,"dialogDismiss",7);this.ariaAttributes={};this.size="360";this.animation=true;this.backdrop=true;this.closeOnBackdropClick=false;this.beforeDismiss=undefined;this.centered=false;this.keyboard=true}get dialog(){return this.hostElement.shadowRoot.querySelector("dialog")}slideInModal(){const t=this.animation?n.mediumTime:0;let i=this.centered?"-50":40;e({targets:this.dialog,duration:t,opacity:[0,1],translateY:[0,i],translateX:["-50%","-50%"],easing:"easeOutSine"})}slideOutModal(t){const i=this.animation?n.mediumTime:0;let o=this.centered?"-50":40;e({targets:this.dialog,duration:i,opacity:[1,0],translateY:[o,0],translateX:["-50%","-50%"],easing:"easeInSine",complete:()=>{if(t){t()}}})}onModalClick(t){const i=this.dialog.getBoundingClientRect();const o=i.top<=t.clientY&&t.clientY<=i.top+i.height&&i.left<=t.clientX&&t.clientX<=i.left+i.width;if(!o&&this.closeOnBackdropClick){this.dismissModal()}}async showModal(){setTimeout((()=>this.dialog.showModal()))}async dismissModal(t){let i=true;if(this.beforeDismiss!==undefined){i=await this.beforeDismiss(t)}if(!i){return}this.slideOutModal((()=>{this.dialog.close(JSON.stringify({type:"dismiss",reason:t},null,2));this.dialogDismiss.emit(t)}))}async closeModal(t){this.slideOutModal((()=>{this.dialog.close(JSON.stringify({type:"close",reason:t},null,2));this.dialogClose.emit(t)}))}componentDidLoad(){this.slideInModal()}componentWillLoad(){this.ariaAttributes=l(this.hostElement)}render(){return o(s,{class:{"no-backdrop":this.backdrop===false,"align-center":this.centered}},o("div",{class:"dialog-backdrop"},o("dialog",{"aria-modal":r(true),"aria-describedby":this.ariaAttributes["aria-describedby"],"aria-labelledby":this.ariaAttributes["aria-labelledby"],class
|
|
2
|
-
//# sourceMappingURL=p-
|
|
1
|
+
import{r as t,c as i,h as o,H as s,g as a}from"./p-76a509c7.js";import{a as e}from"./p-810b5232.js";import{b as l,a as r}from"./p-2fd30d79.js";import{A as n}from"./p-3b97bb69.js";const d="::backdrop{--ix-dialog-backdrop:var(--theme-color-lightbox, #0000008c)}:focus-visible{outline:none !important}:host dialog{margin:0;left:50%}:host dialog::backdrop{-webkit-backdrop-filter:blur(2.7182817459px);backdrop-filter:blur(2.7182817459px)}:host .modal{display:flex;flex-direction:column;position:relative;border:none;border-radius:var(--theme-default-border-radius);background:var(--theme-modal--background);box-shadow:var(--theme-shadow-4);color:var(--theme-color-std-text);overflow:visible;max-height:80vh;pointer-events:all}:host .modal-size-360{width:22.5rem}:host .modal-size-480{width:30rem}:host .modal-size-600{width:37.5rem}:host .modal-size-720{width:45rem}:host .modal-size-840{width:52.5rem}:host .modal-size-full-width{width:95%}:host .modal-size-full-screen{left:0px !important;top:0px !important;transform:none !important;width:calc(100% - 28px);min-width:calc(100% - 28px);max-width:calc(100% - 28px);height:calc(100% - 28px);min-height:calc(100% - 28px);max-height:calc(100% - 28px)}:host .dialog-backdrop{display:block;position:fixed;width:100vw;height:100vh;top:0px;left:0px;pointer-events:none}:host ::slotted(ix-modal-footer){margin-top:auto}:host(.align-center) dialog{margin:0;left:50%;top:50%}:host(.no-backdrop) dialog::backdrop{background-color:transparent !important;-webkit-backdrop-filter:none !important;backdrop-filter:none !important}:host(.with-icon) ::slotted(ix-modal-footer),:host(.with-icon) ::slotted(ix-modal-content){margin-left:2.5rem}";const h=class{constructor(o){t(this,o);this.dialogClose=i(this,"dialogClose",7);this.dialogDismiss=i(this,"dialogDismiss",7);this.ariaAttributes={};this.size="360";this.animation=true;this.backdrop=true;this.closeOnBackdropClick=false;this.beforeDismiss=undefined;this.centered=false;this.keyboard=true}get dialog(){return this.hostElement.shadowRoot.querySelector("dialog")}slideInModal(){const t=this.animation?n.mediumTime:0;let i=this.centered?"-50%":40;e({targets:this.dialog,duration:t,opacity:[0,1],translateY:[0,i],translateX:["-50%","-50%"],easing:"easeOutSine"})}slideOutModal(t){const i=this.animation?n.mediumTime:0;let o=this.centered?"-50%":40;e({targets:this.dialog,duration:i,opacity:[1,0],translateY:[o,0],translateX:["-50%","-50%"],easing:"easeInSine",complete:()=>{if(t){t()}}})}onModalClick(t){const i=this.dialog.getBoundingClientRect();const o=i.top<=t.clientY&&t.clientY<=i.top+i.height&&i.left<=t.clientX&&t.clientX<=i.left+i.width;if(!o&&this.closeOnBackdropClick){this.dismissModal()}}async showModal(){setTimeout((()=>this.dialog.showModal()))}async dismissModal(t){let i=true;if(this.beforeDismiss!==undefined){i=await this.beforeDismiss(t)}if(!i){return}this.slideOutModal((()=>{this.dialog.close(JSON.stringify({type:"dismiss",reason:t},null,2));this.dialogDismiss.emit(t)}))}async closeModal(t){this.slideOutModal((()=>{this.dialog.close(JSON.stringify({type:"close",reason:t},null,2));this.dialogClose.emit(t)}))}componentDidLoad(){this.slideInModal()}componentWillLoad(){this.ariaAttributes=l(this.hostElement)}render(){return o(s,{class:{"no-backdrop":this.backdrop===false,"align-center":this.centered}},o("div",{class:"dialog-backdrop"},o("dialog",{"aria-modal":r(true),"aria-describedby":this.ariaAttributes["aria-describedby"],"aria-labelledby":this.ariaAttributes["aria-labelledby"],class:{modal:true,[`modal-size-${this.size}`]:true},onKeyDown:t=>{if(t.key==="Escape"&&this.keyboard===false){t.preventDefault()}},onClick:t=>this.onModalClick(t),onCancel:t=>{t.preventDefault();this.dismissModal()}},o("slot",null))))}get hostElement(){return a(this)}};h.style=d;export{h as ix_modal};
|
|
2
|
+
//# sourceMappingURL=p-a00079d9.entry.js.map
|