@sankhyalabs/sankhyablocks 8.16.0-dev.114 → 8.16.0-dev.115
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/{ClientSideExporterProvider-a2753c93.js → ClientSideExporterProvider-0ce2bcd9.js} +2 -2
- package/dist/cjs/FormConfigHelper-c664dbae.js +260 -0
- package/dist/cjs/{SnkFormConfigManager-ce7b0951.js → SnkFormConfigManager-aa4631bd.js} +2 -3
- package/dist/cjs/{SnkMessageBuilder-21cc7f09.js → SnkMessageBuilder-e3b7850b.js} +16 -2
- package/dist/cjs/config-header.cjs.entry.js +79 -0
- package/dist/cjs/configs-button.cjs.entry.js +61 -0
- package/dist/cjs/{constants-77c1b8bd.js → constants-6d82e405.js} +8 -38
- package/dist/cjs/field-config_2.cjs.entry.js +324 -0
- package/dist/cjs/fields-layout.cjs.entry.js +341 -0
- package/dist/cjs/fields-selector.cjs.entry.js +74 -0
- package/dist/cjs/guides-configurator.cjs.entry.js +164 -0
- package/dist/cjs/{index-102ba62d.js → index-0ad2baeb.js} +4 -5
- package/dist/cjs/{index-f9e81701.js → index-1cf293c1.js} +28 -10
- package/dist/cjs/loader.cjs.js +2 -2
- package/dist/cjs/pesquisa-grid_2.cjs.entry.js +2 -2
- package/dist/cjs/sankhyablocks.cjs.js +2 -2
- package/dist/cjs/snk-actions-button_8.cjs.entry.js +2 -2
- package/dist/cjs/snk-actions-form.cjs.entry.js +1 -1
- package/dist/cjs/snk-application.cjs.entry.js +3 -3
- package/dist/cjs/snk-attach.cjs.entry.js +4 -4
- package/dist/cjs/snk-client-confirm.cjs.entry.js +1 -1
- package/dist/cjs/snk-configurator.cjs.entry.js +2 -2
- package/dist/cjs/snk-crud.cjs.entry.js +4 -4
- package/dist/cjs/snk-custom-slot-elements.cjs.entry.js +1 -1
- package/dist/cjs/snk-data-exporter.cjs.entry.js +4 -4
- package/dist/cjs/{snk-data-unit-7913a033.js → snk-data-unit-3684c96e.js} +2 -2
- package/dist/cjs/snk-data-unit.cjs.entry.js +3 -3
- package/dist/cjs/snk-default-filter.cjs.entry.js +1 -1
- package/dist/cjs/snk-detail-view.cjs.entry.js +7 -7
- package/dist/cjs/snk-entity-list.cjs.entry.js +1 -1
- package/dist/cjs/snk-exporter-email-sender.cjs.entry.js +1 -1
- package/dist/cjs/snk-expression-group_2.cjs.entry.js +2 -2
- package/dist/cjs/snk-filter-advanced-mode_2.cjs.entry.js +1 -1
- package/dist/cjs/snk-filter-bar_4.cjs.entry.js +1 -1
- package/dist/cjs/snk-filter-binary-select.cjs.entry.js +1 -1
- package/dist/cjs/snk-filter-checkbox-list.cjs.entry.js +1 -1
- package/dist/cjs/snk-filter-detail.cjs.entry.js +1 -1
- package/dist/cjs/snk-filter-field-search_2.cjs.entry.js +1 -1
- package/dist/cjs/snk-filter-modal-item.cjs.entry.js +1 -1
- package/dist/cjs/snk-filter-multi-select.cjs.entry.js +1 -1
- package/dist/cjs/snk-filter-number.cjs.entry.js +1 -1
- package/dist/cjs/snk-filter-period.cjs.entry.js +1 -1
- package/dist/cjs/snk-filter-search.cjs.entry.js +1 -1
- package/dist/cjs/snk-filter-text.cjs.entry.js +1 -1
- package/dist/cjs/snk-form-summary.cjs.entry.js +1 -1
- package/dist/cjs/snk-form-view.cjs.entry.js +1 -1
- package/dist/cjs/snk-form_2.cjs.entry.js +433 -0
- package/dist/cjs/snk-grid.cjs.entry.js +5 -5
- package/dist/cjs/{snk-guides-viewer-450baf6a.js → snk-guides-viewer-edc0a00a.js} +5 -5
- package/dist/cjs/snk-guides-viewer.cjs.entry.js +6 -6
- package/dist/cjs/snk-personalized-filter-editor.cjs.entry.js +1 -1
- package/dist/cjs/snk-personalized-filter.cjs.entry.js +2 -2
- package/dist/cjs/snk-pesquisa.cjs.entry.js +2 -2
- package/dist/cjs/snk-print-selector.cjs.entry.js +1 -1
- package/dist/cjs/snk-simple-bar.cjs.entry.js +1 -1
- package/dist/cjs/snk-simple-crud.cjs.entry.js +6 -6
- package/dist/cjs/snk-taskbar.cjs.entry.js +3 -3
- package/dist/cjs/sortable.esm-9a110bb7.js +2668 -0
- package/dist/cjs/{taskbar-elements-6f4e06af.js → taskbar-elements-3b74cd21.js} +2 -2
- package/dist/cjs/teste-pesquisa.cjs.entry.js +1 -1
- package/dist/collection/collection-manifest.json +7 -14
- package/dist/collection/components/snk-crud/subcomponents/snk-guides-viewer.js +1 -1
- package/dist/collection/components/snk-form-config/FormConfigHelper.js +245 -0
- package/dist/collection/components/snk-form-config/SnkFormConfigManager.js +4 -5
- package/dist/collection/components/snk-form-config/config-header/config-header.css +18 -0
- package/dist/collection/components/snk-form-config/config-header/config-header.js +236 -0
- package/dist/collection/components/snk-form-config/config-header/configs-button/configs-button.css +41 -0
- package/dist/collection/components/snk-form-config/config-header/configs-button/configs-button.js +170 -0
- package/dist/collection/components/snk-form-config/field-item/field-config/field-config.css +21 -0
- package/dist/collection/components/snk-form-config/field-item/field-config/field-config.js +408 -0
- package/dist/collection/components/snk-form-config/field-item/field-item.css +108 -0
- package/dist/collection/components/snk-form-config/field-item/field-item.js +206 -0
- package/dist/collection/components/snk-form-config/fields-layout/fields-layout.css +133 -0
- package/dist/collection/components/snk-form-config/fields-layout/fields-layout.js +578 -0
- package/dist/collection/components/snk-form-config/fields-selector/fields-selector.css +38 -0
- package/dist/collection/components/snk-form-config/fields-selector/fields-selector.js +146 -0
- package/dist/collection/components/snk-form-config/guides-configurator/guides-configurator.css +132 -0
- package/dist/collection/components/snk-form-config/guides-configurator/guides-configurator.js +317 -0
- package/dist/collection/components/snk-form-config/snk-form-config.css +16 -229
- package/dist/collection/components/snk-form-config/snk-form-config.js +288 -980
- package/dist/collection/lib/message/resources/snk-form.msg.js +16 -2
- package/dist/collection/lib/utils/constants.js +7 -1
- package/dist/components/SnkFormConfigManager.js +2 -3
- package/dist/components/SnkMessageBuilder.js +16 -2
- package/dist/components/{snk-tab-config.d.ts → config-header.d.ts} +4 -4
- package/dist/components/config-header.js +6 -0
- package/dist/components/config-header2.js +103 -0
- package/dist/components/{snk-config-options.d.ts → configs-button.d.ts} +4 -4
- package/dist/components/configs-button.js +6 -0
- package/dist/components/configs-button2.js +76 -0
- package/dist/components/constants.js +8 -34
- package/dist/components/field-config.d.ts +11 -0
- package/dist/components/field-config.js +6 -0
- package/dist/components/field-config2.js +525 -0
- package/dist/components/field-item.d.ts +11 -0
- package/dist/components/field-item.js +6 -0
- package/dist/components/field-item2.js +93 -0
- package/dist/components/fields-layout.d.ts +11 -0
- package/dist/components/fields-layout.js +6 -0
- package/dist/components/fields-layout2.js +370 -0
- package/dist/components/{snk-field-config.d.ts → fields-selector.d.ts} +4 -4
- package/dist/components/fields-selector.js +6 -0
- package/dist/components/fields-selector2.js +98 -0
- package/dist/components/guides-configurator.d.ts +11 -0
- package/dist/components/guides-configurator.js +6 -0
- package/dist/components/guides-configurator2.js +182 -0
- package/dist/components/index.d.ts +7 -3
- package/dist/components/index.js +7 -3
- package/dist/components/index2.js +3 -4
- package/dist/components/snk-application2.js +1 -1
- package/dist/components/snk-crud.js +86 -62
- package/dist/components/snk-detail-view2.js +113 -89
- package/dist/components/snk-form-config2.js +253 -953
- package/dist/components/snk-form.js +33 -9
- package/dist/components/sortable.esm.js +2666 -0
- package/dist/esm/{ClientSideExporterProvider-b3871edb.js → ClientSideExporterProvider-3ed744fd.js} +2 -2
- package/dist/esm/FormConfigHelper-49fe72ca.js +248 -0
- package/dist/esm/{SnkFormConfigManager-327dfdd4.js → SnkFormConfigManager-b4b93298.js} +2 -3
- package/dist/esm/{SnkMessageBuilder-0f112c19.js → SnkMessageBuilder-9c269caf.js} +16 -2
- package/dist/esm/config-header.entry.js +75 -0
- package/dist/esm/configs-button.entry.js +57 -0
- package/dist/esm/{constants-7db1128a.js → constants-7b422de0.js} +8 -34
- package/dist/esm/field-config_2.entry.js +319 -0
- package/dist/esm/fields-layout.entry.js +337 -0
- package/dist/esm/fields-selector.entry.js +70 -0
- package/dist/esm/guides-configurator.entry.js +160 -0
- package/dist/esm/{index-a7d3d3f1.js → index-479e1293.js} +28 -10
- package/dist/esm/{index-bdf75557.js → index-b72af127.js} +4 -5
- package/dist/esm/loader.js +3 -3
- package/dist/esm/pesquisa-grid_2.entry.js +2 -2
- package/dist/esm/sankhyablocks.js +3 -3
- package/dist/esm/snk-actions-button_8.entry.js +2 -2
- package/dist/esm/snk-actions-form.entry.js +1 -1
- package/dist/esm/snk-application.entry.js +3 -3
- package/dist/esm/snk-attach.entry.js +4 -4
- package/dist/esm/snk-client-confirm.entry.js +1 -1
- package/dist/esm/snk-configurator.entry.js +2 -2
- package/dist/esm/snk-crud.entry.js +4 -4
- package/dist/esm/snk-custom-slot-elements.entry.js +1 -1
- package/dist/esm/snk-data-exporter.entry.js +4 -4
- package/dist/esm/{snk-data-unit-a95dc9fe.js → snk-data-unit-027bca56.js} +2 -2
- package/dist/esm/snk-data-unit.entry.js +3 -3
- package/dist/esm/snk-default-filter.entry.js +1 -1
- package/dist/esm/snk-detail-view.entry.js +7 -7
- package/dist/esm/snk-entity-list.entry.js +1 -1
- package/dist/esm/snk-exporter-email-sender.entry.js +1 -1
- package/dist/esm/snk-expression-group_2.entry.js +2 -2
- package/dist/esm/snk-filter-advanced-mode_2.entry.js +1 -1
- package/dist/esm/snk-filter-bar_4.entry.js +1 -1
- package/dist/esm/snk-filter-binary-select.entry.js +1 -1
- package/dist/esm/snk-filter-checkbox-list.entry.js +1 -1
- package/dist/esm/snk-filter-detail.entry.js +1 -1
- package/dist/esm/snk-filter-field-search_2.entry.js +1 -1
- package/dist/esm/snk-filter-modal-item.entry.js +1 -1
- package/dist/esm/snk-filter-multi-select.entry.js +1 -1
- package/dist/esm/snk-filter-number.entry.js +1 -1
- package/dist/esm/snk-filter-period.entry.js +1 -1
- package/dist/esm/snk-filter-search.entry.js +1 -1
- package/dist/esm/snk-filter-text.entry.js +1 -1
- package/dist/esm/snk-form-summary.entry.js +1 -1
- package/dist/esm/snk-form-view.entry.js +1 -1
- package/dist/esm/snk-form_2.entry.js +428 -0
- package/dist/esm/snk-grid.entry.js +5 -5
- package/dist/esm/{snk-guides-viewer-ebb40908.js → snk-guides-viewer-32f3d3ab.js} +5 -5
- package/dist/esm/snk-guides-viewer.entry.js +6 -6
- package/dist/esm/snk-personalized-filter-editor.entry.js +1 -1
- package/dist/esm/snk-personalized-filter.entry.js +2 -2
- package/dist/esm/snk-pesquisa.entry.js +2 -2
- package/dist/esm/snk-print-selector.entry.js +1 -1
- package/dist/esm/snk-simple-bar.entry.js +1 -1
- package/dist/esm/snk-simple-crud.entry.js +6 -6
- package/dist/esm/snk-taskbar.entry.js +3 -3
- package/dist/esm/sortable.esm-842f85a3.js +2666 -0
- package/dist/esm/{taskbar-elements-f2cb4922.js → taskbar-elements-171476d4.js} +2 -2
- package/dist/esm/teste-pesquisa.entry.js +1 -1
- package/dist/sankhyablocks/{p-24a0dbd2.entry.js → p-0024d3fd.entry.js} +1 -1
- package/dist/sankhyablocks/{p-e6d90f89.entry.js → p-09e60995.entry.js} +1 -1
- package/dist/sankhyablocks/{p-7effe55f.entry.js → p-0cb295c1.entry.js} +1 -1
- package/dist/sankhyablocks/{p-b0ab5066.entry.js → p-1456d7cb.entry.js} +1 -1
- package/dist/sankhyablocks/{p-9531fd46.entry.js → p-180716b2.entry.js} +1 -1
- package/dist/sankhyablocks/{p-6a03b190.entry.js → p-1ea34488.entry.js} +1 -1
- package/dist/sankhyablocks/{p-5182513e.entry.js → p-21107f0d.entry.js} +1 -1
- package/dist/sankhyablocks/{p-118e769b.entry.js → p-27482793.entry.js} +1 -1
- package/dist/sankhyablocks/{p-d257ff20.entry.js → p-290fea5f.entry.js} +1 -1
- package/dist/sankhyablocks/{p-794840bd.entry.js → p-295aa209.entry.js} +1 -1
- package/dist/sankhyablocks/{p-bd6a6203.js → p-2bde486e.js} +1 -1
- package/dist/sankhyablocks/{p-26b0ce3e.entry.js → p-2fdac5e6.entry.js} +1 -1
- package/dist/sankhyablocks/p-349d1968.entry.js +1 -0
- package/dist/sankhyablocks/p-35e73c5d.js +1 -0
- package/dist/sankhyablocks/{p-89c92727.entry.js → p-398cdd67.entry.js} +1 -1
- package/dist/sankhyablocks/{p-39f3b02d.entry.js → p-3a48bff3.entry.js} +1 -1
- package/dist/sankhyablocks/{p-434817f0.entry.js → p-3d41f5a8.entry.js} +1 -1
- package/dist/sankhyablocks/p-3f24c9b2.js +1 -0
- package/dist/sankhyablocks/{p-def1fe2d.entry.js → p-471b34f4.entry.js} +1 -1
- package/dist/sankhyablocks/{p-7e2ded86.entry.js → p-49d968e2.entry.js} +1 -1
- package/dist/sankhyablocks/p-4d2ff2fb.entry.js +1 -0
- package/dist/sankhyablocks/p-51833248.js +7 -0
- package/dist/sankhyablocks/{p-814d99ec.entry.js → p-60dd1d27.entry.js} +1 -1
- package/dist/sankhyablocks/{p-bd7ccf60.entry.js → p-65c5d430.entry.js} +1 -1
- package/dist/sankhyablocks/{p-21a81901.entry.js → p-667cab42.entry.js} +1 -1
- package/dist/sankhyablocks/{p-a9813a81.entry.js → p-71a05822.entry.js} +1 -1
- package/dist/sankhyablocks/{p-ac8d1cd6.entry.js → p-7345782c.entry.js} +1 -1
- package/dist/sankhyablocks/{p-885802c3.js → p-763b04fa.js} +1 -1
- package/dist/sankhyablocks/{p-d07b18a4.js → p-7de79adf.js} +1 -1
- package/dist/sankhyablocks/p-7e250432.entry.js +1 -0
- package/dist/sankhyablocks/{p-47178038.entry.js → p-83c100f2.entry.js} +1 -1
- package/dist/sankhyablocks/p-86bd4478.entry.js +1 -0
- package/dist/sankhyablocks/p-9019a32f.js +1 -0
- package/dist/sankhyablocks/{p-70da6817.entry.js → p-90805683.entry.js} +1 -1
- package/dist/sankhyablocks/{p-c2e468c9.entry.js → p-91a9abb6.entry.js} +1 -1
- package/dist/sankhyablocks/p-9751c42f.entry.js +1 -0
- package/dist/sankhyablocks/{p-16a1dd18.entry.js → p-9a63f3f7.entry.js} +1 -1
- package/dist/sankhyablocks/{p-90684a75.entry.js → p-9ad3557c.entry.js} +1 -1
- package/dist/sankhyablocks/{p-b6200d32.entry.js → p-9fd87bfd.entry.js} +1 -1
- package/dist/sankhyablocks/p-a06bf7b9.entry.js +1 -0
- package/dist/sankhyablocks/{p-33718dfc.entry.js → p-a227b650.entry.js} +1 -1
- package/dist/sankhyablocks/p-a349689a.js +1 -0
- package/dist/sankhyablocks/{p-13a0ead0.entry.js → p-a5bb2f93.entry.js} +1 -1
- package/dist/sankhyablocks/{p-088d7e7b.js → p-a6513fcb.js} +1 -1
- package/dist/sankhyablocks/{p-8c235d4c.entry.js → p-a76e6d51.entry.js} +1 -1
- package/dist/sankhyablocks/{p-ce94e6c4.entry.js → p-bd665460.entry.js} +1 -1
- package/dist/sankhyablocks/p-c3324d79.entry.js +1 -0
- package/dist/sankhyablocks/{p-bf2acf72.entry.js → p-c6a8a8bc.entry.js} +1 -1
- package/dist/sankhyablocks/{p-043bef5f.entry.js → p-c926cf6b.entry.js} +1 -1
- package/dist/sankhyablocks/{p-79f823f3.entry.js → p-d67526b6.entry.js} +1 -1
- package/dist/sankhyablocks/{p-d2d301a6.js → p-d8d8169b.js} +1 -1
- package/dist/sankhyablocks/{p-5f157b09.entry.js → p-dff65083.entry.js} +1 -1
- package/dist/sankhyablocks/{p-ab12216c.entry.js → p-e2988bb1.entry.js} +1 -1
- package/dist/sankhyablocks/{p-6a5f061b.entry.js → p-e3521eae.entry.js} +1 -1
- package/dist/sankhyablocks/{p-34f7a3ab.entry.js → p-e7cccc45.entry.js} +1 -1
- package/dist/sankhyablocks/{p-1f80174b.entry.js → p-f4e31122.entry.js} +1 -1
- package/dist/sankhyablocks/{p-c7492861.js → p-fc0b609e.js} +1 -1
- package/dist/sankhyablocks/{p-a14a09c3.entry.js → p-ff7060bc.entry.js} +1 -1
- package/dist/sankhyablocks/sankhyablocks.esm.js +1 -1
- package/dist/types/components/snk-form-config/FormConfigHelper.d.ts +31 -0
- package/dist/types/components/snk-form-config/SnkFormConfigManager.d.ts +3 -3
- package/dist/types/components/snk-form-config/config-header/config-header.d.ts +23 -0
- package/dist/types/components/snk-form-config/config-header/configs-button/configs-button.d.ts +19 -0
- package/dist/types/components/snk-form-config/field-item/field-config/field-config.d.ts +56 -0
- package/dist/types/components/snk-form-config/fields-layout/fields-layout.d.ts +63 -0
- package/dist/types/components/snk-form-config/fields-selector/fields-selector.d.ts +18 -0
- package/dist/types/components/snk-form-config/guides-configurator/guides-configurator.d.ts +42 -0
- package/dist/types/components/snk-form-config/snk-form-config.d.ts +51 -120
- package/dist/types/components.d.ts +197 -199
- package/dist/types/lib/utils/constants.d.ts +6 -0
- package/package.json +4 -2
- package/react/components.d.ts +7 -3
- package/react/components.js +7 -3
- package/react/components.js.map +1 -1
- package/dist/cjs/Sortable-fb1c4cbb.js +0 -2853
- package/dist/cjs/snk-config-options_3.cjs.entry.js +0 -1390
- package/dist/cjs/snk-field-config.cjs.entry.js +0 -60
- package/dist/cjs/snk-tab-config.cjs.entry.js +0 -332
- package/dist/collection/components/snk-form-config/subcomponents/snk-config-options/snk-config-options.css +0 -16
- package/dist/collection/components/snk-form-config/subcomponents/snk-config-options/snk-config-options.js +0 -346
- package/dist/collection/components/snk-form-config/subcomponents/snk-field-config/snk-field-config.css +0 -219
- package/dist/collection/components/snk-form-config/subcomponents/snk-field-config/snk-field-config.js +0 -184
- package/dist/collection/components/snk-form-config/subcomponents/snk-tab-config/snk-tab-config.css +0 -323
- package/dist/collection/components/snk-form-config/subcomponents/snk-tab-config/snk-tab-config.js +0 -527
- package/dist/components/snk-config-options.js +0 -6
- package/dist/components/snk-config-options2.js +0 -257
- package/dist/components/snk-field-config.js +0 -6
- package/dist/components/snk-field-config2.js +0 -76
- package/dist/components/snk-tab-config.js +0 -6
- package/dist/components/snk-tab-config2.js +0 -3202
- package/dist/esm/Sortable-83960219.js +0 -2851
- package/dist/esm/snk-config-options_3.entry.js +0 -1384
- package/dist/esm/snk-field-config.entry.js +0 -56
- package/dist/esm/snk-tab-config.entry.js +0 -328
- package/dist/sankhyablocks/p-3749dffb.entry.js +0 -1
- package/dist/sankhyablocks/p-6dc031de.js +0 -1
- package/dist/sankhyablocks/p-79b3cccc.js +0 -1
- package/dist/sankhyablocks/p-9261d8a0.js +0 -1
- package/dist/sankhyablocks/p-c0eb761b.entry.js +0 -1
- package/dist/sankhyablocks/p-e3c71e43.entry.js +0 -1
- package/dist/sankhyablocks/p-fa816fb2.js +0 -1
- package/dist/types/components/snk-form-config/subcomponents/snk-config-options/snk-config-options.d.ts +0 -57
- package/dist/types/components/snk-form-config/subcomponents/snk-field-config/snk-field-config.d.ts +0 -43
- package/dist/types/components/snk-form-config/subcomponents/snk-tab-config/snk-tab-config.d.ts +0 -105
@@ -1,2851 +0,0 @@
|
|
1
|
-
class AbstractEvent {
|
2
|
-
|
3
|
-
constructor(data) {
|
4
|
-
|
5
|
-
this._canceled = false;
|
6
|
-
this.data = data;
|
7
|
-
}
|
8
|
-
|
9
|
-
get type() {
|
10
|
-
return this.constructor.type;
|
11
|
-
}
|
12
|
-
|
13
|
-
get cancelable() {
|
14
|
-
return this.constructor.cancelable;
|
15
|
-
}
|
16
|
-
|
17
|
-
cancel() {
|
18
|
-
this._canceled = true;
|
19
|
-
}
|
20
|
-
|
21
|
-
canceled() {
|
22
|
-
return this._canceled;
|
23
|
-
}
|
24
|
-
|
25
|
-
clone(data) {
|
26
|
-
return new this.constructor({
|
27
|
-
...this.data,
|
28
|
-
...data
|
29
|
-
});
|
30
|
-
}
|
31
|
-
}
|
32
|
-
|
33
|
-
AbstractEvent.type = 'event';
|
34
|
-
|
35
|
-
AbstractEvent.cancelable = false;
|
36
|
-
|
37
|
-
class AbstractPlugin {
|
38
|
-
|
39
|
-
constructor(draggable) {
|
40
|
-
this.draggable = draggable;
|
41
|
-
}
|
42
|
-
|
43
|
-
attach() {
|
44
|
-
throw new Error('Not Implemented');
|
45
|
-
}
|
46
|
-
|
47
|
-
detach() {
|
48
|
-
throw new Error('Not Implemented');
|
49
|
-
}
|
50
|
-
}
|
51
|
-
|
52
|
-
const defaultDelay = {
|
53
|
-
mouse: 0,
|
54
|
-
drag: 0,
|
55
|
-
touch: 100
|
56
|
-
};
|
57
|
-
|
58
|
-
class Sensor {
|
59
|
-
|
60
|
-
constructor(containers = [], options = {}) {
|
61
|
-
|
62
|
-
this.containers = [...containers];
|
63
|
-
|
64
|
-
this.options = {
|
65
|
-
...options
|
66
|
-
};
|
67
|
-
|
68
|
-
this.dragging = false;
|
69
|
-
|
70
|
-
this.currentContainer = null;
|
71
|
-
|
72
|
-
this.originalSource = null;
|
73
|
-
|
74
|
-
this.startEvent = null;
|
75
|
-
|
76
|
-
this.delay = calcDelay(options.delay);
|
77
|
-
}
|
78
|
-
|
79
|
-
attach() {
|
80
|
-
return this;
|
81
|
-
}
|
82
|
-
|
83
|
-
detach() {
|
84
|
-
return this;
|
85
|
-
}
|
86
|
-
|
87
|
-
addContainer(...containers) {
|
88
|
-
this.containers = [...this.containers, ...containers];
|
89
|
-
}
|
90
|
-
|
91
|
-
removeContainer(...containers) {
|
92
|
-
this.containers = this.containers.filter(container => !containers.includes(container));
|
93
|
-
}
|
94
|
-
|
95
|
-
trigger(element, sensorEvent) {
|
96
|
-
const event = document.createEvent('Event');
|
97
|
-
event.detail = sensorEvent;
|
98
|
-
event.initEvent(sensorEvent.type, true, true);
|
99
|
-
element.dispatchEvent(event);
|
100
|
-
this.lastEvent = sensorEvent;
|
101
|
-
return sensorEvent;
|
102
|
-
}
|
103
|
-
}
|
104
|
-
|
105
|
-
function calcDelay(optionsDelay) {
|
106
|
-
const delay = {};
|
107
|
-
if (optionsDelay === undefined) {
|
108
|
-
return {
|
109
|
-
...defaultDelay
|
110
|
-
};
|
111
|
-
}
|
112
|
-
if (typeof optionsDelay === 'number') {
|
113
|
-
for (const key in defaultDelay) {
|
114
|
-
if (Object.prototype.hasOwnProperty.call(defaultDelay, key)) {
|
115
|
-
delay[key] = optionsDelay;
|
116
|
-
}
|
117
|
-
}
|
118
|
-
return delay;
|
119
|
-
}
|
120
|
-
for (const key in defaultDelay) {
|
121
|
-
if (Object.prototype.hasOwnProperty.call(defaultDelay, key)) {
|
122
|
-
if (optionsDelay[key] === undefined) {
|
123
|
-
delay[key] = defaultDelay[key];
|
124
|
-
} else {
|
125
|
-
delay[key] = optionsDelay[key];
|
126
|
-
}
|
127
|
-
}
|
128
|
-
}
|
129
|
-
return delay;
|
130
|
-
}
|
131
|
-
|
132
|
-
function closest(node, value) {
|
133
|
-
if (node == null) {
|
134
|
-
return null;
|
135
|
-
}
|
136
|
-
function conditionFn(currentNode) {
|
137
|
-
if (currentNode == null || value == null) {
|
138
|
-
return false;
|
139
|
-
} else if (isSelector(value)) {
|
140
|
-
return Element.prototype.matches.call(currentNode, value);
|
141
|
-
} else if (isNodeList(value)) {
|
142
|
-
return [...value].includes(currentNode);
|
143
|
-
} else if (isElement(value)) {
|
144
|
-
return value === currentNode;
|
145
|
-
} else if (isFunction(value)) {
|
146
|
-
return value(currentNode);
|
147
|
-
} else {
|
148
|
-
return false;
|
149
|
-
}
|
150
|
-
}
|
151
|
-
let current = node;
|
152
|
-
do {
|
153
|
-
current = current.correspondingUseElement || current.correspondingElement || current;
|
154
|
-
if (conditionFn(current)) {
|
155
|
-
return current;
|
156
|
-
}
|
157
|
-
current = current?.parentNode || null;
|
158
|
-
} while (current != null && current !== document.body && current !== document);
|
159
|
-
return null;
|
160
|
-
}
|
161
|
-
function isSelector(value) {
|
162
|
-
return Boolean(typeof value === 'string');
|
163
|
-
}
|
164
|
-
function isNodeList(value) {
|
165
|
-
return Boolean(value instanceof NodeList || value instanceof Array);
|
166
|
-
}
|
167
|
-
function isElement(value) {
|
168
|
-
return Boolean(value instanceof Node);
|
169
|
-
}
|
170
|
-
function isFunction(value) {
|
171
|
-
return Boolean(typeof value === 'function');
|
172
|
-
}
|
173
|
-
|
174
|
-
function distance(x1, y1, x2, y2) {
|
175
|
-
return Math.sqrt((x2 - x1) ** 2 + (y2 - y1) ** 2);
|
176
|
-
}
|
177
|
-
|
178
|
-
class SensorEvent extends AbstractEvent {
|
179
|
-
|
180
|
-
get originalEvent() {
|
181
|
-
return this.data.originalEvent;
|
182
|
-
}
|
183
|
-
|
184
|
-
get clientX() {
|
185
|
-
return this.data.clientX;
|
186
|
-
}
|
187
|
-
|
188
|
-
get clientY() {
|
189
|
-
return this.data.clientY;
|
190
|
-
}
|
191
|
-
|
192
|
-
get target() {
|
193
|
-
return this.data.target;
|
194
|
-
}
|
195
|
-
|
196
|
-
get container() {
|
197
|
-
return this.data.container;
|
198
|
-
}
|
199
|
-
|
200
|
-
get originalSource() {
|
201
|
-
return this.data.originalSource;
|
202
|
-
}
|
203
|
-
|
204
|
-
get pressure() {
|
205
|
-
return this.data.pressure;
|
206
|
-
}
|
207
|
-
}
|
208
|
-
|
209
|
-
class DragStartSensorEvent extends SensorEvent {}
|
210
|
-
|
211
|
-
DragStartSensorEvent.type = 'drag:start';
|
212
|
-
class DragMoveSensorEvent extends SensorEvent {}
|
213
|
-
|
214
|
-
DragMoveSensorEvent.type = 'drag:move';
|
215
|
-
class DragStopSensorEvent extends SensorEvent {}
|
216
|
-
|
217
|
-
DragStopSensorEvent.type = 'drag:stop';
|
218
|
-
|
219
|
-
const onContextMenuWhileDragging = Symbol('onContextMenuWhileDragging');
|
220
|
-
const onMouseDown = Symbol('onMouseDown');
|
221
|
-
const onMouseMove = Symbol('onMouseMove');
|
222
|
-
const onMouseUp = Symbol('onMouseUp');
|
223
|
-
const startDrag$1 = Symbol('startDrag');
|
224
|
-
const onDistanceChange$1 = Symbol('onDistanceChange');
|
225
|
-
|
226
|
-
class MouseSensor extends Sensor {
|
227
|
-
|
228
|
-
constructor(containers = [], options = {}) {
|
229
|
-
super(containers, options);
|
230
|
-
|
231
|
-
this.mouseDownTimeout = null;
|
232
|
-
|
233
|
-
this.pageX = null;
|
234
|
-
|
235
|
-
this.pageY = null;
|
236
|
-
this[onContextMenuWhileDragging] = this[onContextMenuWhileDragging].bind(this);
|
237
|
-
this[onMouseDown] = this[onMouseDown].bind(this);
|
238
|
-
this[onMouseMove] = this[onMouseMove].bind(this);
|
239
|
-
this[onMouseUp] = this[onMouseUp].bind(this);
|
240
|
-
this[startDrag$1] = this[startDrag$1].bind(this);
|
241
|
-
this[onDistanceChange$1] = this[onDistanceChange$1].bind(this);
|
242
|
-
}
|
243
|
-
|
244
|
-
attach() {
|
245
|
-
document.addEventListener('mousedown', this[onMouseDown], true);
|
246
|
-
}
|
247
|
-
|
248
|
-
detach() {
|
249
|
-
document.removeEventListener('mousedown', this[onMouseDown], true);
|
250
|
-
}
|
251
|
-
|
252
|
-
[onMouseDown](event) {
|
253
|
-
if (event.button !== 0 || event.ctrlKey || event.metaKey) {
|
254
|
-
return;
|
255
|
-
}
|
256
|
-
const container = closest(event.target, this.containers);
|
257
|
-
if (!container) {
|
258
|
-
return;
|
259
|
-
}
|
260
|
-
if (this.options.handle && event.target && !closest(event.target, this.options.handle)) {
|
261
|
-
return;
|
262
|
-
}
|
263
|
-
const originalSource = closest(event.target, this.options.draggable);
|
264
|
-
if (!originalSource) {
|
265
|
-
return;
|
266
|
-
}
|
267
|
-
const {
|
268
|
-
delay
|
269
|
-
} = this;
|
270
|
-
const {
|
271
|
-
pageX,
|
272
|
-
pageY
|
273
|
-
} = event;
|
274
|
-
Object.assign(this, {
|
275
|
-
pageX,
|
276
|
-
pageY
|
277
|
-
});
|
278
|
-
this.onMouseDownAt = Date.now();
|
279
|
-
this.startEvent = event;
|
280
|
-
this.currentContainer = container;
|
281
|
-
this.originalSource = originalSource;
|
282
|
-
document.addEventListener('mouseup', this[onMouseUp]);
|
283
|
-
document.addEventListener('dragstart', preventNativeDragStart);
|
284
|
-
document.addEventListener('mousemove', this[onDistanceChange$1]);
|
285
|
-
this.mouseDownTimeout = window.setTimeout(() => {
|
286
|
-
this[onDistanceChange$1]({
|
287
|
-
pageX: this.pageX,
|
288
|
-
pageY: this.pageY
|
289
|
-
});
|
290
|
-
}, delay.mouse);
|
291
|
-
}
|
292
|
-
|
293
|
-
[startDrag$1]() {
|
294
|
-
const startEvent = this.startEvent;
|
295
|
-
const container = this.currentContainer;
|
296
|
-
const originalSource = this.originalSource;
|
297
|
-
const dragStartEvent = new DragStartSensorEvent({
|
298
|
-
clientX: startEvent.clientX,
|
299
|
-
clientY: startEvent.clientY,
|
300
|
-
target: startEvent.target,
|
301
|
-
container,
|
302
|
-
originalSource,
|
303
|
-
originalEvent: startEvent
|
304
|
-
});
|
305
|
-
this.trigger(this.currentContainer, dragStartEvent);
|
306
|
-
this.dragging = !dragStartEvent.canceled();
|
307
|
-
if (this.dragging) {
|
308
|
-
document.addEventListener('contextmenu', this[onContextMenuWhileDragging], true);
|
309
|
-
document.addEventListener('mousemove', this[onMouseMove]);
|
310
|
-
}
|
311
|
-
}
|
312
|
-
|
313
|
-
[onDistanceChange$1](event) {
|
314
|
-
const {
|
315
|
-
pageX,
|
316
|
-
pageY
|
317
|
-
} = event;
|
318
|
-
const {
|
319
|
-
distance: distance$1
|
320
|
-
} = this.options;
|
321
|
-
const {
|
322
|
-
startEvent,
|
323
|
-
delay
|
324
|
-
} = this;
|
325
|
-
Object.assign(this, {
|
326
|
-
pageX,
|
327
|
-
pageY
|
328
|
-
});
|
329
|
-
if (!this.currentContainer) {
|
330
|
-
return;
|
331
|
-
}
|
332
|
-
const timeElapsed = Date.now() - this.onMouseDownAt;
|
333
|
-
const distanceTravelled = distance(startEvent.pageX, startEvent.pageY, pageX, pageY) || 0;
|
334
|
-
clearTimeout(this.mouseDownTimeout);
|
335
|
-
if (timeElapsed < delay.mouse) {
|
336
|
-
|
337
|
-
document.removeEventListener('mousemove', this[onDistanceChange$1]);
|
338
|
-
} else if (distanceTravelled >= distance$1) {
|
339
|
-
document.removeEventListener('mousemove', this[onDistanceChange$1]);
|
340
|
-
this[startDrag$1]();
|
341
|
-
}
|
342
|
-
}
|
343
|
-
|
344
|
-
[onMouseMove](event) {
|
345
|
-
if (!this.dragging) {
|
346
|
-
return;
|
347
|
-
}
|
348
|
-
const target = document.elementFromPoint(event.clientX, event.clientY);
|
349
|
-
const dragMoveEvent = new DragMoveSensorEvent({
|
350
|
-
clientX: event.clientX,
|
351
|
-
clientY: event.clientY,
|
352
|
-
target,
|
353
|
-
container: this.currentContainer,
|
354
|
-
originalEvent: event
|
355
|
-
});
|
356
|
-
this.trigger(this.currentContainer, dragMoveEvent);
|
357
|
-
}
|
358
|
-
|
359
|
-
[onMouseUp](event) {
|
360
|
-
clearTimeout(this.mouseDownTimeout);
|
361
|
-
if (event.button !== 0) {
|
362
|
-
return;
|
363
|
-
}
|
364
|
-
document.removeEventListener('mouseup', this[onMouseUp]);
|
365
|
-
document.removeEventListener('dragstart', preventNativeDragStart);
|
366
|
-
document.removeEventListener('mousemove', this[onDistanceChange$1]);
|
367
|
-
if (!this.dragging) {
|
368
|
-
return;
|
369
|
-
}
|
370
|
-
const target = document.elementFromPoint(event.clientX, event.clientY);
|
371
|
-
const dragStopEvent = new DragStopSensorEvent({
|
372
|
-
clientX: event.clientX,
|
373
|
-
clientY: event.clientY,
|
374
|
-
target,
|
375
|
-
container: this.currentContainer,
|
376
|
-
originalEvent: event
|
377
|
-
});
|
378
|
-
this.trigger(this.currentContainer, dragStopEvent);
|
379
|
-
document.removeEventListener('contextmenu', this[onContextMenuWhileDragging], true);
|
380
|
-
document.removeEventListener('mousemove', this[onMouseMove]);
|
381
|
-
this.currentContainer = null;
|
382
|
-
this.dragging = false;
|
383
|
-
this.startEvent = null;
|
384
|
-
}
|
385
|
-
|
386
|
-
[onContextMenuWhileDragging](event) {
|
387
|
-
event.preventDefault();
|
388
|
-
}
|
389
|
-
}
|
390
|
-
function preventNativeDragStart(event) {
|
391
|
-
event.preventDefault();
|
392
|
-
}
|
393
|
-
|
394
|
-
function touchCoords(event) {
|
395
|
-
const {
|
396
|
-
touches,
|
397
|
-
changedTouches
|
398
|
-
} = event;
|
399
|
-
return touches && touches[0] || changedTouches && changedTouches[0];
|
400
|
-
}
|
401
|
-
|
402
|
-
const onTouchStart = Symbol('onTouchStart');
|
403
|
-
const onTouchEnd = Symbol('onTouchEnd');
|
404
|
-
const onTouchMove = Symbol('onTouchMove');
|
405
|
-
const startDrag = Symbol('startDrag');
|
406
|
-
const onDistanceChange = Symbol('onDistanceChange');
|
407
|
-
|
408
|
-
let preventScrolling = false;
|
409
|
-
|
410
|
-
window.addEventListener('touchmove', event => {
|
411
|
-
if (!preventScrolling) {
|
412
|
-
return;
|
413
|
-
}
|
414
|
-
|
415
|
-
event.preventDefault();
|
416
|
-
}, {
|
417
|
-
passive: false
|
418
|
-
});
|
419
|
-
|
420
|
-
class TouchSensor extends Sensor {
|
421
|
-
|
422
|
-
constructor(containers = [], options = {}) {
|
423
|
-
super(containers, options);
|
424
|
-
|
425
|
-
this.currentScrollableParent = null;
|
426
|
-
|
427
|
-
this.tapTimeout = null;
|
428
|
-
|
429
|
-
this.touchMoved = false;
|
430
|
-
|
431
|
-
this.pageX = null;
|
432
|
-
|
433
|
-
this.pageY = null;
|
434
|
-
this[onTouchStart] = this[onTouchStart].bind(this);
|
435
|
-
this[onTouchEnd] = this[onTouchEnd].bind(this);
|
436
|
-
this[onTouchMove] = this[onTouchMove].bind(this);
|
437
|
-
this[startDrag] = this[startDrag].bind(this);
|
438
|
-
this[onDistanceChange] = this[onDistanceChange].bind(this);
|
439
|
-
}
|
440
|
-
|
441
|
-
attach() {
|
442
|
-
document.addEventListener('touchstart', this[onTouchStart]);
|
443
|
-
}
|
444
|
-
|
445
|
-
detach() {
|
446
|
-
document.removeEventListener('touchstart', this[onTouchStart]);
|
447
|
-
}
|
448
|
-
|
449
|
-
[onTouchStart](event) {
|
450
|
-
const container = closest(event.target, this.containers);
|
451
|
-
if (!container) {
|
452
|
-
return;
|
453
|
-
}
|
454
|
-
if (this.options.handle && event.target && !closest(event.target, this.options.handle)) {
|
455
|
-
return;
|
456
|
-
}
|
457
|
-
const originalSource = closest(event.target, this.options.draggable);
|
458
|
-
if (!originalSource) {
|
459
|
-
return;
|
460
|
-
}
|
461
|
-
const {
|
462
|
-
distance = 0
|
463
|
-
} = this.options;
|
464
|
-
const {
|
465
|
-
delay
|
466
|
-
} = this;
|
467
|
-
const {
|
468
|
-
pageX,
|
469
|
-
pageY
|
470
|
-
} = touchCoords(event);
|
471
|
-
Object.assign(this, {
|
472
|
-
pageX,
|
473
|
-
pageY
|
474
|
-
});
|
475
|
-
this.onTouchStartAt = Date.now();
|
476
|
-
this.startEvent = event;
|
477
|
-
this.currentContainer = container;
|
478
|
-
this.originalSource = originalSource;
|
479
|
-
document.addEventListener('touchend', this[onTouchEnd]);
|
480
|
-
document.addEventListener('touchcancel', this[onTouchEnd]);
|
481
|
-
document.addEventListener('touchmove', this[onDistanceChange]);
|
482
|
-
container.addEventListener('contextmenu', onContextMenu);
|
483
|
-
if (distance) {
|
484
|
-
preventScrolling = true;
|
485
|
-
}
|
486
|
-
this.tapTimeout = window.setTimeout(() => {
|
487
|
-
this[onDistanceChange]({
|
488
|
-
touches: [{
|
489
|
-
pageX: this.pageX,
|
490
|
-
pageY: this.pageY
|
491
|
-
}]
|
492
|
-
});
|
493
|
-
}, delay.touch);
|
494
|
-
}
|
495
|
-
|
496
|
-
[startDrag]() {
|
497
|
-
const startEvent = this.startEvent;
|
498
|
-
const container = this.currentContainer;
|
499
|
-
const touch = touchCoords(startEvent);
|
500
|
-
const originalSource = this.originalSource;
|
501
|
-
const dragStartEvent = new DragStartSensorEvent({
|
502
|
-
clientX: touch.pageX,
|
503
|
-
clientY: touch.pageY,
|
504
|
-
target: startEvent.target,
|
505
|
-
container,
|
506
|
-
originalSource,
|
507
|
-
originalEvent: startEvent
|
508
|
-
});
|
509
|
-
this.trigger(this.currentContainer, dragStartEvent);
|
510
|
-
this.dragging = !dragStartEvent.canceled();
|
511
|
-
if (this.dragging) {
|
512
|
-
document.addEventListener('touchmove', this[onTouchMove]);
|
513
|
-
}
|
514
|
-
preventScrolling = this.dragging;
|
515
|
-
}
|
516
|
-
|
517
|
-
[onDistanceChange](event) {
|
518
|
-
const {
|
519
|
-
distance: distance$1
|
520
|
-
} = this.options;
|
521
|
-
const {
|
522
|
-
startEvent,
|
523
|
-
delay
|
524
|
-
} = this;
|
525
|
-
const start = touchCoords(startEvent);
|
526
|
-
const current = touchCoords(event);
|
527
|
-
const timeElapsed = Date.now() - this.onTouchStartAt;
|
528
|
-
const distanceTravelled = distance(start.pageX, start.pageY, current.pageX, current.pageY);
|
529
|
-
Object.assign(this, current);
|
530
|
-
clearTimeout(this.tapTimeout);
|
531
|
-
if (timeElapsed < delay.touch) {
|
532
|
-
|
533
|
-
document.removeEventListener('touchmove', this[onDistanceChange]);
|
534
|
-
} else if (distanceTravelled >= distance$1) {
|
535
|
-
document.removeEventListener('touchmove', this[onDistanceChange]);
|
536
|
-
this[startDrag]();
|
537
|
-
}
|
538
|
-
}
|
539
|
-
|
540
|
-
[onTouchMove](event) {
|
541
|
-
if (!this.dragging) {
|
542
|
-
return;
|
543
|
-
}
|
544
|
-
const {
|
545
|
-
pageX,
|
546
|
-
pageY
|
547
|
-
} = touchCoords(event);
|
548
|
-
const target = document.elementFromPoint(pageX - window.scrollX, pageY - window.scrollY);
|
549
|
-
const dragMoveEvent = new DragMoveSensorEvent({
|
550
|
-
clientX: pageX,
|
551
|
-
clientY: pageY,
|
552
|
-
target,
|
553
|
-
container: this.currentContainer,
|
554
|
-
originalEvent: event
|
555
|
-
});
|
556
|
-
this.trigger(this.currentContainer, dragMoveEvent);
|
557
|
-
}
|
558
|
-
|
559
|
-
[onTouchEnd](event) {
|
560
|
-
clearTimeout(this.tapTimeout);
|
561
|
-
preventScrolling = false;
|
562
|
-
document.removeEventListener('touchend', this[onTouchEnd]);
|
563
|
-
document.removeEventListener('touchcancel', this[onTouchEnd]);
|
564
|
-
document.removeEventListener('touchmove', this[onDistanceChange]);
|
565
|
-
if (this.currentContainer) {
|
566
|
-
this.currentContainer.removeEventListener('contextmenu', onContextMenu);
|
567
|
-
}
|
568
|
-
if (!this.dragging) {
|
569
|
-
return;
|
570
|
-
}
|
571
|
-
document.removeEventListener('touchmove', this[onTouchMove]);
|
572
|
-
const {
|
573
|
-
pageX,
|
574
|
-
pageY
|
575
|
-
} = touchCoords(event);
|
576
|
-
const target = document.elementFromPoint(pageX - window.scrollX, pageY - window.scrollY);
|
577
|
-
event.preventDefault();
|
578
|
-
const dragStopEvent = new DragStopSensorEvent({
|
579
|
-
clientX: pageX,
|
580
|
-
clientY: pageY,
|
581
|
-
target,
|
582
|
-
container: this.currentContainer,
|
583
|
-
originalEvent: event
|
584
|
-
});
|
585
|
-
this.trigger(this.currentContainer, dragStopEvent);
|
586
|
-
this.currentContainer = null;
|
587
|
-
this.dragging = false;
|
588
|
-
this.startEvent = null;
|
589
|
-
}
|
590
|
-
}
|
591
|
-
function onContextMenu(event) {
|
592
|
-
event.preventDefault();
|
593
|
-
event.stopPropagation();
|
594
|
-
}
|
595
|
-
|
596
|
-
function createAddInitializerMethod(e, t) {
|
597
|
-
return function (r) {
|
598
|
-
assertNotFinished(t, "addInitializer"), assertCallable(r, "An initializer"), e.push(r);
|
599
|
-
};
|
600
|
-
}
|
601
|
-
function assertInstanceIfPrivate(e, t) {
|
602
|
-
if (!e(t)) throw new TypeError("Attempted to access private element on non-instance");
|
603
|
-
}
|
604
|
-
function memberDec(e, t, r, a, n, i, s, o, c, l, u) {
|
605
|
-
var f;
|
606
|
-
switch (i) {
|
607
|
-
case 1:
|
608
|
-
f = "accessor";
|
609
|
-
break;
|
610
|
-
case 2:
|
611
|
-
f = "method";
|
612
|
-
break;
|
613
|
-
case 3:
|
614
|
-
f = "getter";
|
615
|
-
break;
|
616
|
-
case 4:
|
617
|
-
f = "setter";
|
618
|
-
break;
|
619
|
-
default:
|
620
|
-
f = "field";
|
621
|
-
}
|
622
|
-
var d,
|
623
|
-
p,
|
624
|
-
h = {
|
625
|
-
kind: f,
|
626
|
-
name: o ? "#" + r : r,
|
627
|
-
static: s,
|
628
|
-
private: o,
|
629
|
-
metadata: u
|
630
|
-
},
|
631
|
-
v = {
|
632
|
-
v: !1
|
633
|
-
};
|
634
|
-
if (0 !== i && (h.addInitializer = createAddInitializerMethod(n, v)), o || 0 !== i && 2 !== i) {
|
635
|
-
if (2 === i) d = function (e) {
|
636
|
-
return assertInstanceIfPrivate(l, e), a.value;
|
637
|
-
};else {
|
638
|
-
var y = 0 === i || 1 === i;
|
639
|
-
(y || 3 === i) && (d = o ? function (e) {
|
640
|
-
return assertInstanceIfPrivate(l, e), a.get.call(e);
|
641
|
-
} : function (e) {
|
642
|
-
return a.get.call(e);
|
643
|
-
}), (y || 4 === i) && (p = o ? function (e, t) {
|
644
|
-
assertInstanceIfPrivate(l, e), a.set.call(e, t);
|
645
|
-
} : function (e, t) {
|
646
|
-
a.set.call(e, t);
|
647
|
-
});
|
648
|
-
}
|
649
|
-
} else d = function (e) {
|
650
|
-
return e[r];
|
651
|
-
}, 0 === i && (p = function (e, t) {
|
652
|
-
e[r] = t;
|
653
|
-
});
|
654
|
-
var m = o ? l.bind() : function (e) {
|
655
|
-
return r in e;
|
656
|
-
};
|
657
|
-
h.access = d && p ? {
|
658
|
-
get: d,
|
659
|
-
set: p,
|
660
|
-
has: m
|
661
|
-
} : d ? {
|
662
|
-
get: d,
|
663
|
-
has: m
|
664
|
-
} : {
|
665
|
-
set: p,
|
666
|
-
has: m
|
667
|
-
};
|
668
|
-
try {
|
669
|
-
return e.call(t, c, h);
|
670
|
-
} finally {
|
671
|
-
v.v = !0;
|
672
|
-
}
|
673
|
-
}
|
674
|
-
function assertNotFinished(e, t) {
|
675
|
-
if (e.v) throw new Error("attempted to call " + t + " after decoration was finished");
|
676
|
-
}
|
677
|
-
function assertCallable(e, t) {
|
678
|
-
if ("function" != typeof e) throw new TypeError(t + " must be a function");
|
679
|
-
}
|
680
|
-
function assertValidReturnValue(e, t) {
|
681
|
-
var r = typeof t;
|
682
|
-
if (1 === e) {
|
683
|
-
if ("object" !== r || null === t) throw new TypeError("accessor decorators must return an object with get, set, or init properties or void 0");
|
684
|
-
void 0 !== t.get && assertCallable(t.get, "accessor.get"), void 0 !== t.set && assertCallable(t.set, "accessor.set"), void 0 !== t.init && assertCallable(t.init, "accessor.init");
|
685
|
-
} else if ("function" !== r) {
|
686
|
-
var a;
|
687
|
-
throw a = 0 === e ? "field" : 5 === e ? "class" : "method", new TypeError(a + " decorators must return a function or void 0");
|
688
|
-
}
|
689
|
-
}
|
690
|
-
function curryThis1(e) {
|
691
|
-
return function () {
|
692
|
-
return e(this);
|
693
|
-
};
|
694
|
-
}
|
695
|
-
function curryThis2(e) {
|
696
|
-
return function (t) {
|
697
|
-
e(this, t);
|
698
|
-
};
|
699
|
-
}
|
700
|
-
function applyMemberDec(e, t, r, a, n, i, s, o, c, l, u) {
|
701
|
-
var f,
|
702
|
-
d,
|
703
|
-
p,
|
704
|
-
h,
|
705
|
-
v,
|
706
|
-
y,
|
707
|
-
m = r[0];
|
708
|
-
a || Array.isArray(m) || (m = [m]), o ? f = 0 === i || 1 === i ? {
|
709
|
-
get: curryThis1(r[3]),
|
710
|
-
set: curryThis2(r[4])
|
711
|
-
} : 3 === i ? {
|
712
|
-
get: r[3]
|
713
|
-
} : 4 === i ? {
|
714
|
-
set: r[3]
|
715
|
-
} : {
|
716
|
-
value: r[3]
|
717
|
-
} : 0 !== i && (f = Object.getOwnPropertyDescriptor(t, n)), 1 === i ? p = {
|
718
|
-
get: f.get,
|
719
|
-
set: f.set
|
720
|
-
} : 2 === i ? p = f.value : 3 === i ? p = f.get : 4 === i && (p = f.set);
|
721
|
-
for (var g = a ? 2 : 1, b = m.length - 1; b >= 0; b -= g) {
|
722
|
-
var I;
|
723
|
-
if (void 0 !== (h = memberDec(m[b], a ? m[b - 1] : void 0, n, f, c, i, s, o, p, l, u))) assertValidReturnValue(i, h), 0 === i ? I = h : 1 === i ? (I = h.init, v = h.get || p.get, y = h.set || p.set, p = {
|
724
|
-
get: v,
|
725
|
-
set: y
|
726
|
-
}) : p = h, void 0 !== I && (void 0 === d ? d = I : "function" == typeof d ? d = [d, I] : d.push(I));
|
727
|
-
}
|
728
|
-
if (0 === i || 1 === i) {
|
729
|
-
if (void 0 === d) d = function (e, t) {
|
730
|
-
return t;
|
731
|
-
};else if ("function" != typeof d) {
|
732
|
-
var w = d;
|
733
|
-
d = function (e, t) {
|
734
|
-
for (var r = t, a = w.length - 1; a >= 0; a--) r = w[a].call(e, r);
|
735
|
-
return r;
|
736
|
-
};
|
737
|
-
} else {
|
738
|
-
var M = d;
|
739
|
-
d = function (e, t) {
|
740
|
-
return M.call(e, t);
|
741
|
-
};
|
742
|
-
}
|
743
|
-
e.push(d);
|
744
|
-
}
|
745
|
-
0 !== i && (1 === i ? (f.get = p.get, f.set = p.set) : 2 === i ? f.value = p : 3 === i ? f.get = p : 4 === i && (f.set = p), o ? 1 === i ? (e.push(function (e, t) {
|
746
|
-
return p.get.call(e, t);
|
747
|
-
}), e.push(function (e, t) {
|
748
|
-
return p.set.call(e, t);
|
749
|
-
})) : 2 === i ? e.push(p) : e.push(function (e, t) {
|
750
|
-
return p.call(e, t);
|
751
|
-
}) : Object.defineProperty(t, n, f));
|
752
|
-
}
|
753
|
-
function applyMemberDecs(e, t, r, a) {
|
754
|
-
for (var n, i, s, o = [], c = new Map(), l = new Map(), u = 0; u < t.length; u++) {
|
755
|
-
var f = t[u];
|
756
|
-
if (Array.isArray(f)) {
|
757
|
-
var d,
|
758
|
-
p,
|
759
|
-
h = f[1],
|
760
|
-
v = f[2],
|
761
|
-
y = f.length > 3,
|
762
|
-
m = 16 & h,
|
763
|
-
g = !!(8 & h),
|
764
|
-
b = r;
|
765
|
-
if (h &= 7, g ? (d = e, 0 !== h && (p = i = i || []), y && !s && (s = function (t) {
|
766
|
-
return _checkInRHS(t) === e;
|
767
|
-
}), b = s) : (d = e.prototype, 0 !== h && (p = n = n || [])), 0 !== h && !y) {
|
768
|
-
var I = g ? l : c,
|
769
|
-
w = I.get(v) || 0;
|
770
|
-
if (!0 === w || 3 === w && 4 !== h || 4 === w && 3 !== h) throw new Error("Attempted to decorate a public method/accessor that has the same name as a previously decorated public method/accessor. This is not currently supported by the decorators plugin. Property name was: " + v);
|
771
|
-
I.set(v, !(!w && h > 2) || h);
|
772
|
-
}
|
773
|
-
applyMemberDec(o, d, f, m, v, h, g, y, p, b, a);
|
774
|
-
}
|
775
|
-
}
|
776
|
-
return pushInitializers(o, n), pushInitializers(o, i), o;
|
777
|
-
}
|
778
|
-
function pushInitializers(e, t) {
|
779
|
-
t && e.push(function (e) {
|
780
|
-
for (var r = 0; r < t.length; r++) t[r].call(e);
|
781
|
-
return e;
|
782
|
-
});
|
783
|
-
}
|
784
|
-
function applyClassDecs(e, t, r, a) {
|
785
|
-
if (t.length) {
|
786
|
-
for (var n = [], i = e, s = e.name, o = r ? 2 : 1, c = t.length - 1; c >= 0; c -= o) {
|
787
|
-
var l = {
|
788
|
-
v: !1
|
789
|
-
};
|
790
|
-
try {
|
791
|
-
var u = t[c].call(r ? t[c - 1] : void 0, i, {
|
792
|
-
kind: "class",
|
793
|
-
name: s,
|
794
|
-
addInitializer: createAddInitializerMethod(n, l),
|
795
|
-
metadata: a
|
796
|
-
});
|
797
|
-
} finally {
|
798
|
-
l.v = !0;
|
799
|
-
}
|
800
|
-
void 0 !== u && (assertValidReturnValue(5, u), i = u);
|
801
|
-
}
|
802
|
-
return [defineMetadata(i, a), function () {
|
803
|
-
for (var e = 0; e < n.length; e++) n[e].call(i);
|
804
|
-
}];
|
805
|
-
}
|
806
|
-
}
|
807
|
-
function defineMetadata(e, t) {
|
808
|
-
return Object.defineProperty(e, Symbol.metadata || Symbol.for("Symbol.metadata"), {
|
809
|
-
configurable: !0,
|
810
|
-
enumerable: !0,
|
811
|
-
value: t
|
812
|
-
});
|
813
|
-
}
|
814
|
-
function _applyDecs2305(e, t, r, a, n, i) {
|
815
|
-
if (arguments.length >= 6) var s = i[Symbol.metadata || Symbol.for("Symbol.metadata")];
|
816
|
-
var o = Object.create(void 0 === s ? null : s),
|
817
|
-
c = applyMemberDecs(e, t, n, o);
|
818
|
-
return r.length || defineMetadata(e, o), {
|
819
|
-
e: c,
|
820
|
-
get c() {
|
821
|
-
return applyClassDecs(e, r, a, o);
|
822
|
-
}
|
823
|
-
};
|
824
|
-
}
|
825
|
-
function _checkInRHS(e) {
|
826
|
-
if (Object(e) !== e) throw TypeError("right-hand side of 'in' should be an object, got " + (null !== e ? typeof e : "null"));
|
827
|
-
return e;
|
828
|
-
}
|
829
|
-
|
830
|
-
function AutoBind(originalMethod, {
|
831
|
-
name,
|
832
|
-
addInitializer
|
833
|
-
}) {
|
834
|
-
addInitializer(function () {
|
835
|
-
|
836
|
-
this[name] = originalMethod.bind(this);
|
837
|
-
|
838
|
-
});
|
839
|
-
}
|
840
|
-
|
841
|
-
function requestNextAnimationFrame(callback) {
|
842
|
-
return requestAnimationFrame(() => {
|
843
|
-
requestAnimationFrame(callback);
|
844
|
-
});
|
845
|
-
}
|
846
|
-
|
847
|
-
class DragEvent extends AbstractEvent {
|
848
|
-
|
849
|
-
constructor(data) {
|
850
|
-
super(data);
|
851
|
-
this.data = data;
|
852
|
-
}
|
853
|
-
|
854
|
-
get source() {
|
855
|
-
return this.data.source;
|
856
|
-
}
|
857
|
-
|
858
|
-
get originalSource() {
|
859
|
-
return this.data.originalSource;
|
860
|
-
}
|
861
|
-
|
862
|
-
get mirror() {
|
863
|
-
return this.data.mirror;
|
864
|
-
}
|
865
|
-
|
866
|
-
get sourceContainer() {
|
867
|
-
return this.data.sourceContainer;
|
868
|
-
}
|
869
|
-
|
870
|
-
get sensorEvent() {
|
871
|
-
return this.data.sensorEvent;
|
872
|
-
}
|
873
|
-
|
874
|
-
get originalEvent() {
|
875
|
-
if (this.sensorEvent) {
|
876
|
-
return this.sensorEvent.originalEvent;
|
877
|
-
}
|
878
|
-
return null;
|
879
|
-
}
|
880
|
-
}
|
881
|
-
|
882
|
-
DragEvent.type = 'drag';
|
883
|
-
class DragStartEvent extends DragEvent {}
|
884
|
-
|
885
|
-
DragStartEvent.type = 'drag:start';
|
886
|
-
DragStartEvent.cancelable = true;
|
887
|
-
class DragMoveEvent extends DragEvent {}
|
888
|
-
|
889
|
-
DragMoveEvent.type = 'drag:move';
|
890
|
-
|
891
|
-
class DragOverEvent extends DragEvent {
|
892
|
-
|
893
|
-
get overContainer() {
|
894
|
-
return this.data.overContainer;
|
895
|
-
}
|
896
|
-
|
897
|
-
get over() {
|
898
|
-
return this.data.over;
|
899
|
-
}
|
900
|
-
}
|
901
|
-
DragOverEvent.type = 'drag:over';
|
902
|
-
DragOverEvent.cancelable = true;
|
903
|
-
function isDragOverEvent(event) {
|
904
|
-
return event.type === DragOverEvent.type;
|
905
|
-
}
|
906
|
-
|
907
|
-
class DragOutEvent extends DragEvent {
|
908
|
-
|
909
|
-
get overContainer() {
|
910
|
-
return this.data.overContainer;
|
911
|
-
}
|
912
|
-
|
913
|
-
get over() {
|
914
|
-
return this.data.over;
|
915
|
-
}
|
916
|
-
}
|
917
|
-
|
918
|
-
DragOutEvent.type = 'drag:out';
|
919
|
-
|
920
|
-
class DragOverContainerEvent extends DragEvent {
|
921
|
-
|
922
|
-
get overContainer() {
|
923
|
-
return this.data.overContainer;
|
924
|
-
}
|
925
|
-
}
|
926
|
-
|
927
|
-
DragOverContainerEvent.type = 'drag:over:container';
|
928
|
-
|
929
|
-
class DragOutContainerEvent extends DragEvent {
|
930
|
-
|
931
|
-
get overContainer() {
|
932
|
-
return this.data.overContainer;
|
933
|
-
}
|
934
|
-
}
|
935
|
-
|
936
|
-
DragOutContainerEvent.type = 'drag:out:container';
|
937
|
-
|
938
|
-
class DragPressureEvent extends DragEvent {
|
939
|
-
|
940
|
-
get pressure() {
|
941
|
-
return this.data.pressure;
|
942
|
-
}
|
943
|
-
}
|
944
|
-
|
945
|
-
DragPressureEvent.type = 'drag:pressure';
|
946
|
-
class DragStopEvent extends DragEvent {}
|
947
|
-
|
948
|
-
DragStopEvent.type = 'drag:stop';
|
949
|
-
DragStopEvent.cancelable = true;
|
950
|
-
class DragStoppedEvent extends DragEvent {}
|
951
|
-
DragStoppedEvent.type = 'drag:stopped';
|
952
|
-
|
953
|
-
var _initProto$1, _class$1;
|
954
|
-
|
955
|
-
class ResizeMirror extends AbstractPlugin {
|
956
|
-
|
957
|
-
constructor(draggable) {
|
958
|
-
_initProto$1(super(draggable));
|
959
|
-
|
960
|
-
this.lastWidth = 0;
|
961
|
-
|
962
|
-
this.lastHeight = 0;
|
963
|
-
|
964
|
-
this.mirror = null;
|
965
|
-
}
|
966
|
-
|
967
|
-
attach() {
|
968
|
-
this.draggable.on('mirror:created', this.onMirrorCreated).on('drag:over', this.onDragOver).on('drag:over:container', this.onDragOver);
|
969
|
-
}
|
970
|
-
|
971
|
-
detach() {
|
972
|
-
this.draggable.off('mirror:created', this.onMirrorCreated).off('mirror:destroy', this.onMirrorDestroy).off('drag:over', this.onDragOver).off('drag:over:container', this.onDragOver);
|
973
|
-
}
|
974
|
-
|
975
|
-
getOptions() {
|
976
|
-
return this.draggable.options.resizeMirror || {};
|
977
|
-
}
|
978
|
-
|
979
|
-
onMirrorCreated({
|
980
|
-
mirror
|
981
|
-
}) {
|
982
|
-
this.mirror = mirror;
|
983
|
-
}
|
984
|
-
|
985
|
-
onMirrorDestroy() {
|
986
|
-
this.mirror = null;
|
987
|
-
}
|
988
|
-
|
989
|
-
onDragOver(dragEvent) {
|
990
|
-
this.resize(dragEvent);
|
991
|
-
}
|
992
|
-
|
993
|
-
resize(dragEvent) {
|
994
|
-
requestAnimationFrame(() => {
|
995
|
-
let over = null;
|
996
|
-
const {
|
997
|
-
overContainer
|
998
|
-
} = dragEvent;
|
999
|
-
if (this.mirror == null || this.mirror.parentNode == null) {
|
1000
|
-
return;
|
1001
|
-
}
|
1002
|
-
if (this.mirror.parentNode !== overContainer) {
|
1003
|
-
overContainer.appendChild(this.mirror);
|
1004
|
-
}
|
1005
|
-
if (isDragOverEvent(dragEvent)) {
|
1006
|
-
over = dragEvent.over;
|
1007
|
-
}
|
1008
|
-
const overElement = over || this.draggable.getDraggableElementsForContainer(overContainer)[0];
|
1009
|
-
if (!overElement) {
|
1010
|
-
return;
|
1011
|
-
}
|
1012
|
-
requestNextAnimationFrame(() => {
|
1013
|
-
const overRect = overElement.getBoundingClientRect();
|
1014
|
-
if (this.mirror == null || this.lastHeight === overRect.height && this.lastWidth === overRect.width) {
|
1015
|
-
return;
|
1016
|
-
}
|
1017
|
-
this.mirror.style.width = `${overRect.width}px`;
|
1018
|
-
this.mirror.style.height = `${overRect.height}px`;
|
1019
|
-
this.lastWidth = overRect.width;
|
1020
|
-
this.lastHeight = overRect.height;
|
1021
|
-
});
|
1022
|
-
});
|
1023
|
-
}
|
1024
|
-
}
|
1025
|
-
_class$1 = ResizeMirror;
|
1026
|
-
[_initProto$1] = _applyDecs2305(_class$1, [[AutoBind, 2, "onMirrorCreated"], [AutoBind, 2, "onMirrorDestroy"], [AutoBind, 2, "onDragOver"]], [], 0, void 0, AbstractPlugin).e;
|
1027
|
-
|
1028
|
-
var _initProto, _class;
|
1029
|
-
|
1030
|
-
const defaultOptions$5 = {
|
1031
|
-
duration: 150,
|
1032
|
-
easingFunction: 'ease-in-out',
|
1033
|
-
horizontal: false
|
1034
|
-
};
|
1035
|
-
|
1036
|
-
class SwapAnimation extends AbstractPlugin {
|
1037
|
-
|
1038
|
-
constructor(draggable) {
|
1039
|
-
_initProto(super(draggable));
|
1040
|
-
|
1041
|
-
this.options = {
|
1042
|
-
...defaultOptions$5,
|
1043
|
-
...this.getOptions()
|
1044
|
-
};
|
1045
|
-
|
1046
|
-
this.lastAnimationFrame = null;
|
1047
|
-
}
|
1048
|
-
|
1049
|
-
attach() {
|
1050
|
-
this.draggable.on('sortable:sorted', this.onSortableSorted);
|
1051
|
-
}
|
1052
|
-
|
1053
|
-
detach() {
|
1054
|
-
this.draggable.off('sortable:sorted', this.onSortableSorted);
|
1055
|
-
}
|
1056
|
-
|
1057
|
-
getOptions() {
|
1058
|
-
return this.draggable.options.swapAnimation || {};
|
1059
|
-
}
|
1060
|
-
|
1061
|
-
onSortableSorted({
|
1062
|
-
oldIndex,
|
1063
|
-
newIndex,
|
1064
|
-
dragEvent
|
1065
|
-
}) {
|
1066
|
-
const {
|
1067
|
-
source,
|
1068
|
-
over
|
1069
|
-
} = dragEvent;
|
1070
|
-
if (this.lastAnimationFrame) {
|
1071
|
-
cancelAnimationFrame(this.lastAnimationFrame);
|
1072
|
-
}
|
1073
|
-
|
1074
|
-
this.lastAnimationFrame = requestAnimationFrame(() => {
|
1075
|
-
if (oldIndex >= newIndex) {
|
1076
|
-
animate(source, over, this.options);
|
1077
|
-
} else {
|
1078
|
-
animate(over, source, this.options);
|
1079
|
-
}
|
1080
|
-
});
|
1081
|
-
}
|
1082
|
-
}
|
1083
|
-
|
1084
|
-
_class = SwapAnimation;
|
1085
|
-
[_initProto] = _applyDecs2305(_class, [[AutoBind, 2, "onSortableSorted"]], [], 0, void 0, AbstractPlugin).e;
|
1086
|
-
function animate(from, to, {
|
1087
|
-
duration,
|
1088
|
-
easingFunction,
|
1089
|
-
horizontal
|
1090
|
-
}) {
|
1091
|
-
for (const element of [from, to]) {
|
1092
|
-
element.style.pointerEvents = 'none';
|
1093
|
-
}
|
1094
|
-
if (horizontal) {
|
1095
|
-
const width = from.offsetWidth;
|
1096
|
-
from.style.transform = `translate3d(${width}px, 0, 0)`;
|
1097
|
-
to.style.transform = `translate3d(-${width}px, 0, 0)`;
|
1098
|
-
} else {
|
1099
|
-
const height = from.offsetHeight;
|
1100
|
-
from.style.transform = `translate3d(0, ${height}px, 0)`;
|
1101
|
-
to.style.transform = `translate3d(0, -${height}px, 0)`;
|
1102
|
-
}
|
1103
|
-
requestAnimationFrame(() => {
|
1104
|
-
for (const element of [from, to]) {
|
1105
|
-
element.addEventListener('transitionend', resetElementOnTransitionEnd);
|
1106
|
-
element.style.transition = `transform ${duration}ms ${easingFunction}`;
|
1107
|
-
element.style.transform = '';
|
1108
|
-
}
|
1109
|
-
});
|
1110
|
-
}
|
1111
|
-
|
1112
|
-
function resetElementOnTransitionEnd(event) {
|
1113
|
-
if (event.target == null || !isHTMLElement(event.target)) {
|
1114
|
-
return;
|
1115
|
-
}
|
1116
|
-
event.target.style.transition = '';
|
1117
|
-
event.target.style.pointerEvents = '';
|
1118
|
-
event.target.removeEventListener('transitionend', resetElementOnTransitionEnd);
|
1119
|
-
}
|
1120
|
-
function isHTMLElement(eventTarget) {
|
1121
|
-
return Boolean('style' in eventTarget);
|
1122
|
-
}
|
1123
|
-
|
1124
|
-
const onInitialize$1 = Symbol('onInitialize');
|
1125
|
-
const onDestroy$1 = Symbol('onDestroy');
|
1126
|
-
const announceEvent = Symbol('announceEvent');
|
1127
|
-
const announceMessage = Symbol('announceMessage');
|
1128
|
-
const ARIA_RELEVANT = 'aria-relevant';
|
1129
|
-
const ARIA_ATOMIC = 'aria-atomic';
|
1130
|
-
const ARIA_LIVE = 'aria-live';
|
1131
|
-
const ROLE = 'role';
|
1132
|
-
|
1133
|
-
const defaultOptions$4 = {
|
1134
|
-
expire: 7000
|
1135
|
-
};
|
1136
|
-
|
1137
|
-
class Announcement extends AbstractPlugin {
|
1138
|
-
|
1139
|
-
constructor(draggable) {
|
1140
|
-
super(draggable);
|
1141
|
-
|
1142
|
-
this.options = {
|
1143
|
-
...defaultOptions$4,
|
1144
|
-
...this.getOptions()
|
1145
|
-
};
|
1146
|
-
|
1147
|
-
this.originalTriggerMethod = this.draggable.trigger;
|
1148
|
-
this[onInitialize$1] = this[onInitialize$1].bind(this);
|
1149
|
-
this[onDestroy$1] = this[onDestroy$1].bind(this);
|
1150
|
-
}
|
1151
|
-
|
1152
|
-
attach() {
|
1153
|
-
this.draggable.on('draggable:initialize', this[onInitialize$1]);
|
1154
|
-
}
|
1155
|
-
|
1156
|
-
detach() {
|
1157
|
-
this.draggable.off('draggable:destroy', this[onDestroy$1]);
|
1158
|
-
}
|
1159
|
-
|
1160
|
-
getOptions() {
|
1161
|
-
return this.draggable.options.announcements || {};
|
1162
|
-
}
|
1163
|
-
|
1164
|
-
[announceEvent](event) {
|
1165
|
-
const message = this.options[event.type];
|
1166
|
-
if (message && typeof message === 'string') {
|
1167
|
-
this[announceMessage](message);
|
1168
|
-
}
|
1169
|
-
if (message && typeof message === 'function') {
|
1170
|
-
this[announceMessage](message(event));
|
1171
|
-
}
|
1172
|
-
}
|
1173
|
-
|
1174
|
-
[announceMessage](message) {
|
1175
|
-
announce(message, {
|
1176
|
-
expire: this.options.expire
|
1177
|
-
});
|
1178
|
-
}
|
1179
|
-
|
1180
|
-
[onInitialize$1]() {
|
1181
|
-
|
1182
|
-
this.draggable.trigger = event => {
|
1183
|
-
try {
|
1184
|
-
this[announceEvent](event);
|
1185
|
-
} finally {
|
1186
|
-
|
1187
|
-
this.originalTriggerMethod.call(this.draggable, event);
|
1188
|
-
}
|
1189
|
-
};
|
1190
|
-
}
|
1191
|
-
|
1192
|
-
[onDestroy$1]() {
|
1193
|
-
this.draggable.trigger = this.originalTriggerMethod;
|
1194
|
-
}
|
1195
|
-
}
|
1196
|
-
|
1197
|
-
const liveRegion = createRegion();
|
1198
|
-
|
1199
|
-
function announce(message, {
|
1200
|
-
expire
|
1201
|
-
}) {
|
1202
|
-
const element = document.createElement('div');
|
1203
|
-
element.textContent = message;
|
1204
|
-
liveRegion.appendChild(element);
|
1205
|
-
return setTimeout(() => {
|
1206
|
-
liveRegion.removeChild(element);
|
1207
|
-
}, expire);
|
1208
|
-
}
|
1209
|
-
|
1210
|
-
function createRegion() {
|
1211
|
-
const element = document.createElement('div');
|
1212
|
-
element.setAttribute('id', 'draggable-live-region');
|
1213
|
-
element.setAttribute(ARIA_RELEVANT, 'additions');
|
1214
|
-
element.setAttribute(ARIA_ATOMIC, 'true');
|
1215
|
-
element.setAttribute(ARIA_LIVE, 'assertive');
|
1216
|
-
element.setAttribute(ROLE, 'log');
|
1217
|
-
element.style.position = 'fixed';
|
1218
|
-
element.style.width = '1px';
|
1219
|
-
element.style.height = '1px';
|
1220
|
-
element.style.top = '-1px';
|
1221
|
-
element.style.overflow = 'hidden';
|
1222
|
-
return element;
|
1223
|
-
}
|
1224
|
-
|
1225
|
-
document.addEventListener('DOMContentLoaded', () => {
|
1226
|
-
document.body.appendChild(liveRegion);
|
1227
|
-
});
|
1228
|
-
|
1229
|
-
const onInitialize = Symbol('onInitialize');
|
1230
|
-
const onDestroy = Symbol('onDestroy');
|
1231
|
-
|
1232
|
-
const defaultOptions$3 = {};
|
1233
|
-
|
1234
|
-
class Focusable extends AbstractPlugin {
|
1235
|
-
|
1236
|
-
constructor(draggable) {
|
1237
|
-
super(draggable);
|
1238
|
-
|
1239
|
-
this.options = {
|
1240
|
-
...defaultOptions$3,
|
1241
|
-
...this.getOptions()
|
1242
|
-
};
|
1243
|
-
this[onInitialize] = this[onInitialize].bind(this);
|
1244
|
-
this[onDestroy] = this[onDestroy].bind(this);
|
1245
|
-
}
|
1246
|
-
|
1247
|
-
attach() {
|
1248
|
-
this.draggable.on('draggable:initialize', this[onInitialize]).on('draggable:destroy', this[onDestroy]);
|
1249
|
-
}
|
1250
|
-
|
1251
|
-
detach() {
|
1252
|
-
this.draggable.off('draggable:initialize', this[onInitialize]).off('draggable:destroy', this[onDestroy]);
|
1253
|
-
|
1254
|
-
this[onDestroy]();
|
1255
|
-
}
|
1256
|
-
|
1257
|
-
getOptions() {
|
1258
|
-
return this.draggable.options.focusable || {};
|
1259
|
-
}
|
1260
|
-
|
1261
|
-
getElements() {
|
1262
|
-
return [...this.draggable.containers, ...this.draggable.getDraggableElements()];
|
1263
|
-
}
|
1264
|
-
|
1265
|
-
[onInitialize]() {
|
1266
|
-
|
1267
|
-
requestAnimationFrame(() => {
|
1268
|
-
this.getElements().forEach(element => decorateElement(element));
|
1269
|
-
});
|
1270
|
-
}
|
1271
|
-
|
1272
|
-
[onDestroy]() {
|
1273
|
-
|
1274
|
-
requestAnimationFrame(() => {
|
1275
|
-
this.getElements().forEach(element => stripElement(element));
|
1276
|
-
});
|
1277
|
-
}
|
1278
|
-
}
|
1279
|
-
|
1280
|
-
const elementsWithMissingTabIndex = [];
|
1281
|
-
|
1282
|
-
function decorateElement(element) {
|
1283
|
-
const hasMissingTabIndex = Boolean(!element.getAttribute('tabindex') && element.tabIndex === -1);
|
1284
|
-
if (hasMissingTabIndex) {
|
1285
|
-
elementsWithMissingTabIndex.push(element);
|
1286
|
-
element.tabIndex = 0;
|
1287
|
-
}
|
1288
|
-
}
|
1289
|
-
|
1290
|
-
function stripElement(element) {
|
1291
|
-
const tabIndexElementPosition = elementsWithMissingTabIndex.indexOf(element);
|
1292
|
-
if (tabIndexElementPosition !== -1) {
|
1293
|
-
element.tabIndex = -1;
|
1294
|
-
elementsWithMissingTabIndex.splice(tabIndexElementPosition, 1);
|
1295
|
-
}
|
1296
|
-
}
|
1297
|
-
|
1298
|
-
class MirrorEvent extends AbstractEvent {
|
1299
|
-
|
1300
|
-
constructor(data) {
|
1301
|
-
super(data);
|
1302
|
-
this.data = data;
|
1303
|
-
}
|
1304
|
-
|
1305
|
-
get source() {
|
1306
|
-
return this.data.source;
|
1307
|
-
}
|
1308
|
-
|
1309
|
-
get originalSource() {
|
1310
|
-
return this.data.originalSource;
|
1311
|
-
}
|
1312
|
-
|
1313
|
-
get sourceContainer() {
|
1314
|
-
return this.data.sourceContainer;
|
1315
|
-
}
|
1316
|
-
|
1317
|
-
get sensorEvent() {
|
1318
|
-
return this.data.sensorEvent;
|
1319
|
-
}
|
1320
|
-
|
1321
|
-
get dragEvent() {
|
1322
|
-
return this.data.dragEvent;
|
1323
|
-
}
|
1324
|
-
|
1325
|
-
get originalEvent() {
|
1326
|
-
if (this.sensorEvent) {
|
1327
|
-
return this.sensorEvent.originalEvent;
|
1328
|
-
}
|
1329
|
-
return null;
|
1330
|
-
}
|
1331
|
-
}
|
1332
|
-
|
1333
|
-
class MirrorCreateEvent extends MirrorEvent {}
|
1334
|
-
MirrorCreateEvent.type = 'mirror:create';
|
1335
|
-
|
1336
|
-
class MirrorCreatedEvent extends MirrorEvent {
|
1337
|
-
|
1338
|
-
get mirror() {
|
1339
|
-
return this.data.mirror;
|
1340
|
-
}
|
1341
|
-
}
|
1342
|
-
MirrorCreatedEvent.type = 'mirror:created';
|
1343
|
-
|
1344
|
-
class MirrorAttachedEvent extends MirrorEvent {
|
1345
|
-
|
1346
|
-
get mirror() {
|
1347
|
-
return this.data.mirror;
|
1348
|
-
}
|
1349
|
-
}
|
1350
|
-
MirrorAttachedEvent.type = 'mirror:attached';
|
1351
|
-
|
1352
|
-
class MirrorMoveEvent extends MirrorEvent {
|
1353
|
-
|
1354
|
-
get mirror() {
|
1355
|
-
return this.data.mirror;
|
1356
|
-
}
|
1357
|
-
|
1358
|
-
get passedThreshX() {
|
1359
|
-
return this.data.passedThreshX;
|
1360
|
-
}
|
1361
|
-
|
1362
|
-
get passedThreshY() {
|
1363
|
-
return this.data.passedThreshY;
|
1364
|
-
}
|
1365
|
-
}
|
1366
|
-
MirrorMoveEvent.type = 'mirror:move';
|
1367
|
-
MirrorMoveEvent.cancelable = true;
|
1368
|
-
|
1369
|
-
class MirrorMovedEvent extends MirrorEvent {
|
1370
|
-
|
1371
|
-
get mirror() {
|
1372
|
-
return this.data.mirror;
|
1373
|
-
}
|
1374
|
-
|
1375
|
-
get passedThreshX() {
|
1376
|
-
return this.data.passedThreshX;
|
1377
|
-
}
|
1378
|
-
|
1379
|
-
get passedThreshY() {
|
1380
|
-
return this.data.passedThreshY;
|
1381
|
-
}
|
1382
|
-
}
|
1383
|
-
MirrorMovedEvent.type = 'mirror:moved';
|
1384
|
-
|
1385
|
-
class MirrorDestroyEvent extends MirrorEvent {
|
1386
|
-
|
1387
|
-
get mirror() {
|
1388
|
-
return this.data.mirror;
|
1389
|
-
}
|
1390
|
-
}
|
1391
|
-
MirrorDestroyEvent.type = 'mirror:destroy';
|
1392
|
-
MirrorDestroyEvent.cancelable = true;
|
1393
|
-
|
1394
|
-
const onDragStart$3 = Symbol('onDragStart');
|
1395
|
-
const onDragMove$2 = Symbol('onDragMove');
|
1396
|
-
const onDragStop$3 = Symbol('onDragStop');
|
1397
|
-
const onMirrorCreated = Symbol('onMirrorCreated');
|
1398
|
-
const onMirrorMove = Symbol('onMirrorMove');
|
1399
|
-
const onScroll = Symbol('onScroll');
|
1400
|
-
const getAppendableContainer = Symbol('getAppendableContainer');
|
1401
|
-
|
1402
|
-
const defaultOptions$2 = {
|
1403
|
-
constrainDimensions: false,
|
1404
|
-
xAxis: true,
|
1405
|
-
yAxis: true,
|
1406
|
-
cursorOffsetX: null,
|
1407
|
-
cursorOffsetY: null,
|
1408
|
-
thresholdX: null,
|
1409
|
-
thresholdY: null
|
1410
|
-
};
|
1411
|
-
|
1412
|
-
class Mirror extends AbstractPlugin {
|
1413
|
-
|
1414
|
-
constructor(draggable) {
|
1415
|
-
super(draggable);
|
1416
|
-
|
1417
|
-
this.options = {
|
1418
|
-
...defaultOptions$2,
|
1419
|
-
...this.getOptions()
|
1420
|
-
};
|
1421
|
-
|
1422
|
-
this.scrollOffset = {
|
1423
|
-
x: 0,
|
1424
|
-
y: 0
|
1425
|
-
};
|
1426
|
-
|
1427
|
-
this.initialScrollOffset = {
|
1428
|
-
x: window.scrollX,
|
1429
|
-
y: window.scrollY
|
1430
|
-
};
|
1431
|
-
this[onDragStart$3] = this[onDragStart$3].bind(this);
|
1432
|
-
this[onDragMove$2] = this[onDragMove$2].bind(this);
|
1433
|
-
this[onDragStop$3] = this[onDragStop$3].bind(this);
|
1434
|
-
this[onMirrorCreated] = this[onMirrorCreated].bind(this);
|
1435
|
-
this[onMirrorMove] = this[onMirrorMove].bind(this);
|
1436
|
-
this[onScroll] = this[onScroll].bind(this);
|
1437
|
-
}
|
1438
|
-
|
1439
|
-
attach() {
|
1440
|
-
this.draggable.on('drag:start', this[onDragStart$3]).on('drag:move', this[onDragMove$2]).on('drag:stop', this[onDragStop$3]).on('mirror:created', this[onMirrorCreated]).on('mirror:move', this[onMirrorMove]);
|
1441
|
-
}
|
1442
|
-
|
1443
|
-
detach() {
|
1444
|
-
this.draggable.off('drag:start', this[onDragStart$3]).off('drag:move', this[onDragMove$2]).off('drag:stop', this[onDragStop$3]).off('mirror:created', this[onMirrorCreated]).off('mirror:move', this[onMirrorMove]);
|
1445
|
-
}
|
1446
|
-
|
1447
|
-
getOptions() {
|
1448
|
-
return this.draggable.options.mirror || {};
|
1449
|
-
}
|
1450
|
-
[onDragStart$3](dragEvent) {
|
1451
|
-
if (dragEvent.canceled()) {
|
1452
|
-
return;
|
1453
|
-
}
|
1454
|
-
if ('ontouchstart' in window) {
|
1455
|
-
document.addEventListener('scroll', this[onScroll], true);
|
1456
|
-
}
|
1457
|
-
this.initialScrollOffset = {
|
1458
|
-
x: window.scrollX,
|
1459
|
-
y: window.scrollY
|
1460
|
-
};
|
1461
|
-
const {
|
1462
|
-
source,
|
1463
|
-
originalSource,
|
1464
|
-
sourceContainer,
|
1465
|
-
sensorEvent
|
1466
|
-
} = dragEvent;
|
1467
|
-
|
1468
|
-
this.lastMirrorMovedClient = {
|
1469
|
-
x: sensorEvent.clientX,
|
1470
|
-
y: sensorEvent.clientY
|
1471
|
-
};
|
1472
|
-
const mirrorCreateEvent = new MirrorCreateEvent({
|
1473
|
-
source,
|
1474
|
-
originalSource,
|
1475
|
-
sourceContainer,
|
1476
|
-
sensorEvent,
|
1477
|
-
dragEvent
|
1478
|
-
});
|
1479
|
-
this.draggable.trigger(mirrorCreateEvent);
|
1480
|
-
if (isNativeDragEvent(sensorEvent) || mirrorCreateEvent.canceled()) {
|
1481
|
-
return;
|
1482
|
-
}
|
1483
|
-
const appendableContainer = this[getAppendableContainer](source) || sourceContainer;
|
1484
|
-
this.mirror = source.cloneNode(true);
|
1485
|
-
const mirrorCreatedEvent = new MirrorCreatedEvent({
|
1486
|
-
source,
|
1487
|
-
originalSource,
|
1488
|
-
sourceContainer,
|
1489
|
-
sensorEvent,
|
1490
|
-
dragEvent,
|
1491
|
-
mirror: this.mirror
|
1492
|
-
});
|
1493
|
-
const mirrorAttachedEvent = new MirrorAttachedEvent({
|
1494
|
-
source,
|
1495
|
-
originalSource,
|
1496
|
-
sourceContainer,
|
1497
|
-
sensorEvent,
|
1498
|
-
dragEvent,
|
1499
|
-
mirror: this.mirror
|
1500
|
-
});
|
1501
|
-
this.draggable.trigger(mirrorCreatedEvent);
|
1502
|
-
appendableContainer.appendChild(this.mirror);
|
1503
|
-
this.draggable.trigger(mirrorAttachedEvent);
|
1504
|
-
}
|
1505
|
-
[onDragMove$2](dragEvent) {
|
1506
|
-
if (!this.mirror || dragEvent.canceled()) {
|
1507
|
-
return;
|
1508
|
-
}
|
1509
|
-
const {
|
1510
|
-
source,
|
1511
|
-
originalSource,
|
1512
|
-
sourceContainer,
|
1513
|
-
sensorEvent
|
1514
|
-
} = dragEvent;
|
1515
|
-
let passedThreshX = true;
|
1516
|
-
let passedThreshY = true;
|
1517
|
-
if (this.options.thresholdX || this.options.thresholdY) {
|
1518
|
-
const {
|
1519
|
-
x: lastX,
|
1520
|
-
y: lastY
|
1521
|
-
} = this.lastMirrorMovedClient;
|
1522
|
-
if (Math.abs(lastX - sensorEvent.clientX) < this.options.thresholdX) {
|
1523
|
-
passedThreshX = false;
|
1524
|
-
} else {
|
1525
|
-
this.lastMirrorMovedClient.x = sensorEvent.clientX;
|
1526
|
-
}
|
1527
|
-
if (Math.abs(lastY - sensorEvent.clientY) < this.options.thresholdY) {
|
1528
|
-
passedThreshY = false;
|
1529
|
-
} else {
|
1530
|
-
this.lastMirrorMovedClient.y = sensorEvent.clientY;
|
1531
|
-
}
|
1532
|
-
if (!passedThreshX && !passedThreshY) {
|
1533
|
-
return;
|
1534
|
-
}
|
1535
|
-
}
|
1536
|
-
const mirrorMoveEvent = new MirrorMoveEvent({
|
1537
|
-
source,
|
1538
|
-
originalSource,
|
1539
|
-
sourceContainer,
|
1540
|
-
sensorEvent,
|
1541
|
-
dragEvent,
|
1542
|
-
mirror: this.mirror,
|
1543
|
-
passedThreshX,
|
1544
|
-
passedThreshY
|
1545
|
-
});
|
1546
|
-
this.draggable.trigger(mirrorMoveEvent);
|
1547
|
-
}
|
1548
|
-
[onDragStop$3](dragEvent) {
|
1549
|
-
if ('ontouchstart' in window) {
|
1550
|
-
document.removeEventListener('scroll', this[onScroll], true);
|
1551
|
-
}
|
1552
|
-
this.initialScrollOffset = {
|
1553
|
-
x: 0,
|
1554
|
-
y: 0
|
1555
|
-
};
|
1556
|
-
this.scrollOffset = {
|
1557
|
-
x: 0,
|
1558
|
-
y: 0
|
1559
|
-
};
|
1560
|
-
if (!this.mirror) {
|
1561
|
-
return;
|
1562
|
-
}
|
1563
|
-
const {
|
1564
|
-
source,
|
1565
|
-
sourceContainer,
|
1566
|
-
sensorEvent
|
1567
|
-
} = dragEvent;
|
1568
|
-
const mirrorDestroyEvent = new MirrorDestroyEvent({
|
1569
|
-
source,
|
1570
|
-
mirror: this.mirror,
|
1571
|
-
sourceContainer,
|
1572
|
-
sensorEvent,
|
1573
|
-
dragEvent
|
1574
|
-
});
|
1575
|
-
this.draggable.trigger(mirrorDestroyEvent);
|
1576
|
-
if (!mirrorDestroyEvent.canceled()) {
|
1577
|
-
this.mirror.remove();
|
1578
|
-
}
|
1579
|
-
}
|
1580
|
-
[onScroll]() {
|
1581
|
-
this.scrollOffset = {
|
1582
|
-
x: window.scrollX - this.initialScrollOffset.x,
|
1583
|
-
y: window.scrollY - this.initialScrollOffset.y
|
1584
|
-
};
|
1585
|
-
}
|
1586
|
-
|
1587
|
-
[onMirrorCreated]({
|
1588
|
-
mirror,
|
1589
|
-
source,
|
1590
|
-
sensorEvent
|
1591
|
-
}) {
|
1592
|
-
const mirrorClasses = this.draggable.getClassNamesFor('mirror');
|
1593
|
-
const setState = ({
|
1594
|
-
mirrorOffset,
|
1595
|
-
initialX,
|
1596
|
-
initialY,
|
1597
|
-
...args
|
1598
|
-
}) => {
|
1599
|
-
this.mirrorOffset = mirrorOffset;
|
1600
|
-
this.initialX = initialX;
|
1601
|
-
this.initialY = initialY;
|
1602
|
-
this.lastMovedX = initialX;
|
1603
|
-
this.lastMovedY = initialY;
|
1604
|
-
return {
|
1605
|
-
mirrorOffset,
|
1606
|
-
initialX,
|
1607
|
-
initialY,
|
1608
|
-
...args
|
1609
|
-
};
|
1610
|
-
};
|
1611
|
-
mirror.style.display = 'none';
|
1612
|
-
const initialState = {
|
1613
|
-
mirror,
|
1614
|
-
source,
|
1615
|
-
sensorEvent,
|
1616
|
-
mirrorClasses,
|
1617
|
-
scrollOffset: this.scrollOffset,
|
1618
|
-
options: this.options,
|
1619
|
-
passedThreshX: true,
|
1620
|
-
passedThreshY: true
|
1621
|
-
};
|
1622
|
-
return Promise.resolve(initialState)
|
1623
|
-
|
1624
|
-
.then(computeMirrorDimensions).then(calculateMirrorOffset).then(resetMirror).then(addMirrorClasses).then(positionMirror({
|
1625
|
-
initial: true
|
1626
|
-
})).then(removeMirrorID).then(setState);
|
1627
|
-
}
|
1628
|
-
|
1629
|
-
[onMirrorMove](mirrorEvent) {
|
1630
|
-
if (mirrorEvent.canceled()) {
|
1631
|
-
return null;
|
1632
|
-
}
|
1633
|
-
const setState = ({
|
1634
|
-
lastMovedX,
|
1635
|
-
lastMovedY,
|
1636
|
-
...args
|
1637
|
-
}) => {
|
1638
|
-
this.lastMovedX = lastMovedX;
|
1639
|
-
this.lastMovedY = lastMovedY;
|
1640
|
-
return {
|
1641
|
-
lastMovedX,
|
1642
|
-
lastMovedY,
|
1643
|
-
...args
|
1644
|
-
};
|
1645
|
-
};
|
1646
|
-
const triggerMoved = args => {
|
1647
|
-
const mirrorMovedEvent = new MirrorMovedEvent({
|
1648
|
-
source: mirrorEvent.source,
|
1649
|
-
originalSource: mirrorEvent.originalSource,
|
1650
|
-
sourceContainer: mirrorEvent.sourceContainer,
|
1651
|
-
sensorEvent: mirrorEvent.sensorEvent,
|
1652
|
-
dragEvent: mirrorEvent.dragEvent,
|
1653
|
-
mirror: this.mirror,
|
1654
|
-
passedThreshX: mirrorEvent.passedThreshX,
|
1655
|
-
passedThreshY: mirrorEvent.passedThreshY
|
1656
|
-
});
|
1657
|
-
this.draggable.trigger(mirrorMovedEvent);
|
1658
|
-
return args;
|
1659
|
-
};
|
1660
|
-
const initialState = {
|
1661
|
-
mirror: mirrorEvent.mirror,
|
1662
|
-
sensorEvent: mirrorEvent.sensorEvent,
|
1663
|
-
mirrorOffset: this.mirrorOffset,
|
1664
|
-
options: this.options,
|
1665
|
-
initialX: this.initialX,
|
1666
|
-
initialY: this.initialY,
|
1667
|
-
scrollOffset: this.scrollOffset,
|
1668
|
-
passedThreshX: mirrorEvent.passedThreshX,
|
1669
|
-
passedThreshY: mirrorEvent.passedThreshY,
|
1670
|
-
lastMovedX: this.lastMovedX,
|
1671
|
-
lastMovedY: this.lastMovedY
|
1672
|
-
};
|
1673
|
-
return Promise.resolve(initialState).then(positionMirror({
|
1674
|
-
raf: true
|
1675
|
-
})).then(setState).then(triggerMoved);
|
1676
|
-
}
|
1677
|
-
|
1678
|
-
[getAppendableContainer](source) {
|
1679
|
-
const appendTo = this.options.appendTo;
|
1680
|
-
if (typeof appendTo === 'string') {
|
1681
|
-
return document.querySelector(appendTo);
|
1682
|
-
} else if (appendTo instanceof HTMLElement) {
|
1683
|
-
return appendTo;
|
1684
|
-
} else if (typeof appendTo === 'function') {
|
1685
|
-
return appendTo(source);
|
1686
|
-
} else {
|
1687
|
-
return source.parentNode;
|
1688
|
-
}
|
1689
|
-
}
|
1690
|
-
}
|
1691
|
-
|
1692
|
-
function computeMirrorDimensions({
|
1693
|
-
source,
|
1694
|
-
...args
|
1695
|
-
}) {
|
1696
|
-
return withPromise(resolve => {
|
1697
|
-
const sourceRect = source.getBoundingClientRect();
|
1698
|
-
resolve({
|
1699
|
-
source,
|
1700
|
-
sourceRect,
|
1701
|
-
...args
|
1702
|
-
});
|
1703
|
-
});
|
1704
|
-
}
|
1705
|
-
|
1706
|
-
function calculateMirrorOffset({
|
1707
|
-
sensorEvent,
|
1708
|
-
sourceRect,
|
1709
|
-
options,
|
1710
|
-
...args
|
1711
|
-
}) {
|
1712
|
-
return withPromise(resolve => {
|
1713
|
-
const top = options.cursorOffsetY === null ? sensorEvent.clientY - sourceRect.top : options.cursorOffsetY;
|
1714
|
-
const left = options.cursorOffsetX === null ? sensorEvent.clientX - sourceRect.left : options.cursorOffsetX;
|
1715
|
-
const mirrorOffset = {
|
1716
|
-
top,
|
1717
|
-
left
|
1718
|
-
};
|
1719
|
-
resolve({
|
1720
|
-
sensorEvent,
|
1721
|
-
sourceRect,
|
1722
|
-
mirrorOffset,
|
1723
|
-
options,
|
1724
|
-
...args
|
1725
|
-
});
|
1726
|
-
});
|
1727
|
-
}
|
1728
|
-
|
1729
|
-
function resetMirror({
|
1730
|
-
mirror,
|
1731
|
-
source,
|
1732
|
-
options,
|
1733
|
-
...args
|
1734
|
-
}) {
|
1735
|
-
return withPromise(resolve => {
|
1736
|
-
let offsetHeight;
|
1737
|
-
let offsetWidth;
|
1738
|
-
if (options.constrainDimensions) {
|
1739
|
-
const computedSourceStyles = getComputedStyle(source);
|
1740
|
-
offsetHeight = computedSourceStyles.getPropertyValue('height');
|
1741
|
-
offsetWidth = computedSourceStyles.getPropertyValue('width');
|
1742
|
-
}
|
1743
|
-
mirror.style.display = null;
|
1744
|
-
mirror.style.position = 'fixed';
|
1745
|
-
mirror.style.pointerEvents = 'none';
|
1746
|
-
mirror.style.top = 0;
|
1747
|
-
mirror.style.left = 0;
|
1748
|
-
mirror.style.margin = 0;
|
1749
|
-
if (options.constrainDimensions) {
|
1750
|
-
mirror.style.height = offsetHeight;
|
1751
|
-
mirror.style.width = offsetWidth;
|
1752
|
-
}
|
1753
|
-
resolve({
|
1754
|
-
mirror,
|
1755
|
-
source,
|
1756
|
-
options,
|
1757
|
-
...args
|
1758
|
-
});
|
1759
|
-
});
|
1760
|
-
}
|
1761
|
-
|
1762
|
-
function addMirrorClasses({
|
1763
|
-
mirror,
|
1764
|
-
mirrorClasses,
|
1765
|
-
...args
|
1766
|
-
}) {
|
1767
|
-
return withPromise(resolve => {
|
1768
|
-
mirror.classList.add(...mirrorClasses);
|
1769
|
-
resolve({
|
1770
|
-
mirror,
|
1771
|
-
mirrorClasses,
|
1772
|
-
...args
|
1773
|
-
});
|
1774
|
-
});
|
1775
|
-
}
|
1776
|
-
|
1777
|
-
function removeMirrorID({
|
1778
|
-
mirror,
|
1779
|
-
...args
|
1780
|
-
}) {
|
1781
|
-
return withPromise(resolve => {
|
1782
|
-
mirror.removeAttribute('id');
|
1783
|
-
delete mirror.id;
|
1784
|
-
resolve({
|
1785
|
-
mirror,
|
1786
|
-
...args
|
1787
|
-
});
|
1788
|
-
});
|
1789
|
-
}
|
1790
|
-
|
1791
|
-
function positionMirror({
|
1792
|
-
withFrame = false,
|
1793
|
-
initial = false
|
1794
|
-
} = {}) {
|
1795
|
-
return ({
|
1796
|
-
mirror,
|
1797
|
-
sensorEvent,
|
1798
|
-
mirrorOffset,
|
1799
|
-
initialY,
|
1800
|
-
initialX,
|
1801
|
-
scrollOffset,
|
1802
|
-
options,
|
1803
|
-
passedThreshX,
|
1804
|
-
passedThreshY,
|
1805
|
-
lastMovedX,
|
1806
|
-
lastMovedY,
|
1807
|
-
...args
|
1808
|
-
}) => {
|
1809
|
-
return withPromise(resolve => {
|
1810
|
-
const result = {
|
1811
|
-
mirror,
|
1812
|
-
sensorEvent,
|
1813
|
-
mirrorOffset,
|
1814
|
-
options,
|
1815
|
-
...args
|
1816
|
-
};
|
1817
|
-
if (mirrorOffset) {
|
1818
|
-
const x = passedThreshX ? Math.round((sensorEvent.clientX - mirrorOffset.left - scrollOffset.x) / (options.thresholdX || 1)) * (options.thresholdX || 1) : Math.round(lastMovedX);
|
1819
|
-
const y = passedThreshY ? Math.round((sensorEvent.clientY - mirrorOffset.top - scrollOffset.y) / (options.thresholdY || 1)) * (options.thresholdY || 1) : Math.round(lastMovedY);
|
1820
|
-
if (options.xAxis && options.yAxis || initial) {
|
1821
|
-
mirror.style.transform = `translate3d(${x}px, ${y}px, 0)`;
|
1822
|
-
} else if (options.xAxis && !options.yAxis) {
|
1823
|
-
mirror.style.transform = `translate3d(${x}px, ${initialY}px, 0)`;
|
1824
|
-
} else if (options.yAxis && !options.xAxis) {
|
1825
|
-
mirror.style.transform = `translate3d(${initialX}px, ${y}px, 0)`;
|
1826
|
-
}
|
1827
|
-
if (initial) {
|
1828
|
-
result.initialX = x;
|
1829
|
-
result.initialY = y;
|
1830
|
-
}
|
1831
|
-
result.lastMovedX = x;
|
1832
|
-
result.lastMovedY = y;
|
1833
|
-
}
|
1834
|
-
resolve(result);
|
1835
|
-
}, {
|
1836
|
-
frame: withFrame
|
1837
|
-
});
|
1838
|
-
};
|
1839
|
-
}
|
1840
|
-
|
1841
|
-
function withPromise(callback, {
|
1842
|
-
raf = false
|
1843
|
-
} = {}) {
|
1844
|
-
return new Promise((resolve, reject) => {
|
1845
|
-
if (raf) {
|
1846
|
-
requestAnimationFrame(() => {
|
1847
|
-
callback(resolve, reject);
|
1848
|
-
});
|
1849
|
-
} else {
|
1850
|
-
callback(resolve, reject);
|
1851
|
-
}
|
1852
|
-
});
|
1853
|
-
}
|
1854
|
-
|
1855
|
-
function isNativeDragEvent(sensorEvent) {
|
1856
|
-
return /^drag/.test(sensorEvent.originalEvent.type);
|
1857
|
-
}
|
1858
|
-
|
1859
|
-
const onDragStart$2 = Symbol('onDragStart');
|
1860
|
-
const onDragMove$1 = Symbol('onDragMove');
|
1861
|
-
const onDragStop$2 = Symbol('onDragStop');
|
1862
|
-
const scroll = Symbol('scroll');
|
1863
|
-
|
1864
|
-
const defaultOptions$1 = {
|
1865
|
-
speed: 6,
|
1866
|
-
sensitivity: 50,
|
1867
|
-
scrollableElements: []
|
1868
|
-
};
|
1869
|
-
|
1870
|
-
class Scrollable extends AbstractPlugin {
|
1871
|
-
|
1872
|
-
constructor(draggable) {
|
1873
|
-
super(draggable);
|
1874
|
-
|
1875
|
-
this.options = {
|
1876
|
-
...defaultOptions$1,
|
1877
|
-
...this.getOptions()
|
1878
|
-
};
|
1879
|
-
|
1880
|
-
this.currentMousePosition = null;
|
1881
|
-
|
1882
|
-
this.scrollAnimationFrame = null;
|
1883
|
-
|
1884
|
-
this.scrollableElement = null;
|
1885
|
-
|
1886
|
-
this.findScrollableElementFrame = null;
|
1887
|
-
this[onDragStart$2] = this[onDragStart$2].bind(this);
|
1888
|
-
this[onDragMove$1] = this[onDragMove$1].bind(this);
|
1889
|
-
this[onDragStop$2] = this[onDragStop$2].bind(this);
|
1890
|
-
this[scroll] = this[scroll].bind(this);
|
1891
|
-
}
|
1892
|
-
|
1893
|
-
attach() {
|
1894
|
-
this.draggable.on('drag:start', this[onDragStart$2]).on('drag:move', this[onDragMove$1]).on('drag:stop', this[onDragStop$2]);
|
1895
|
-
}
|
1896
|
-
|
1897
|
-
detach() {
|
1898
|
-
this.draggable.off('drag:start', this[onDragStart$2]).off('drag:move', this[onDragMove$1]).off('drag:stop', this[onDragStop$2]);
|
1899
|
-
}
|
1900
|
-
|
1901
|
-
getOptions() {
|
1902
|
-
return this.draggable.options.scrollable || {};
|
1903
|
-
}
|
1904
|
-
|
1905
|
-
getScrollableElement(target) {
|
1906
|
-
if (this.hasDefinedScrollableElements()) {
|
1907
|
-
return closest(target, this.options.scrollableElements) || document.documentElement;
|
1908
|
-
} else {
|
1909
|
-
return closestScrollableElement(target);
|
1910
|
-
}
|
1911
|
-
}
|
1912
|
-
|
1913
|
-
hasDefinedScrollableElements() {
|
1914
|
-
return Boolean(this.options.scrollableElements.length !== 0);
|
1915
|
-
}
|
1916
|
-
|
1917
|
-
[onDragStart$2](dragEvent) {
|
1918
|
-
this.findScrollableElementFrame = requestAnimationFrame(() => {
|
1919
|
-
this.scrollableElement = this.getScrollableElement(dragEvent.source);
|
1920
|
-
});
|
1921
|
-
}
|
1922
|
-
|
1923
|
-
[onDragMove$1](dragEvent) {
|
1924
|
-
this.findScrollableElementFrame = requestAnimationFrame(() => {
|
1925
|
-
this.scrollableElement = this.getScrollableElement(dragEvent.sensorEvent.target);
|
1926
|
-
});
|
1927
|
-
if (!this.scrollableElement) {
|
1928
|
-
return;
|
1929
|
-
}
|
1930
|
-
const sensorEvent = dragEvent.sensorEvent;
|
1931
|
-
const scrollOffset = {
|
1932
|
-
x: 0,
|
1933
|
-
y: 0
|
1934
|
-
};
|
1935
|
-
if ('ontouchstart' in window) {
|
1936
|
-
scrollOffset.y = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop || 0;
|
1937
|
-
scrollOffset.x = window.pageXOffset || document.documentElement.scrollLeft || document.body.scrollLeft || 0;
|
1938
|
-
}
|
1939
|
-
this.currentMousePosition = {
|
1940
|
-
clientX: sensorEvent.clientX - scrollOffset.x,
|
1941
|
-
clientY: sensorEvent.clientY - scrollOffset.y
|
1942
|
-
};
|
1943
|
-
this.scrollAnimationFrame = requestAnimationFrame(this[scroll]);
|
1944
|
-
}
|
1945
|
-
|
1946
|
-
[onDragStop$2]() {
|
1947
|
-
cancelAnimationFrame(this.scrollAnimationFrame);
|
1948
|
-
cancelAnimationFrame(this.findScrollableElementFrame);
|
1949
|
-
this.scrollableElement = null;
|
1950
|
-
this.scrollAnimationFrame = null;
|
1951
|
-
this.findScrollableElementFrame = null;
|
1952
|
-
this.currentMousePosition = null;
|
1953
|
-
}
|
1954
|
-
|
1955
|
-
[scroll]() {
|
1956
|
-
if (!this.scrollableElement || !this.currentMousePosition) {
|
1957
|
-
return;
|
1958
|
-
}
|
1959
|
-
cancelAnimationFrame(this.scrollAnimationFrame);
|
1960
|
-
const {
|
1961
|
-
speed,
|
1962
|
-
sensitivity
|
1963
|
-
} = this.options;
|
1964
|
-
const rect = this.scrollableElement.getBoundingClientRect();
|
1965
|
-
const bottomCutOff = rect.bottom > window.innerHeight;
|
1966
|
-
const topCutOff = rect.top < 0;
|
1967
|
-
const cutOff = topCutOff || bottomCutOff;
|
1968
|
-
const documentScrollingElement = getDocumentScrollingElement();
|
1969
|
-
const scrollableElement = this.scrollableElement;
|
1970
|
-
const clientX = this.currentMousePosition.clientX;
|
1971
|
-
const clientY = this.currentMousePosition.clientY;
|
1972
|
-
if (scrollableElement !== document.body && scrollableElement !== document.documentElement && !cutOff) {
|
1973
|
-
const {
|
1974
|
-
offsetHeight,
|
1975
|
-
offsetWidth
|
1976
|
-
} = scrollableElement;
|
1977
|
-
if (rect.top + offsetHeight - clientY < sensitivity) {
|
1978
|
-
scrollableElement.scrollTop += speed;
|
1979
|
-
} else if (clientY - rect.top < sensitivity) {
|
1980
|
-
scrollableElement.scrollTop -= speed;
|
1981
|
-
}
|
1982
|
-
if (rect.left + offsetWidth - clientX < sensitivity) {
|
1983
|
-
scrollableElement.scrollLeft += speed;
|
1984
|
-
} else if (clientX - rect.left < sensitivity) {
|
1985
|
-
scrollableElement.scrollLeft -= speed;
|
1986
|
-
}
|
1987
|
-
} else {
|
1988
|
-
const {
|
1989
|
-
innerHeight,
|
1990
|
-
innerWidth
|
1991
|
-
} = window;
|
1992
|
-
if (clientY < sensitivity) {
|
1993
|
-
documentScrollingElement.scrollTop -= speed;
|
1994
|
-
} else if (innerHeight - clientY < sensitivity) {
|
1995
|
-
documentScrollingElement.scrollTop += speed;
|
1996
|
-
}
|
1997
|
-
if (clientX < sensitivity) {
|
1998
|
-
documentScrollingElement.scrollLeft -= speed;
|
1999
|
-
} else if (innerWidth - clientX < sensitivity) {
|
2000
|
-
documentScrollingElement.scrollLeft += speed;
|
2001
|
-
}
|
2002
|
-
}
|
2003
|
-
this.scrollAnimationFrame = requestAnimationFrame(this[scroll]);
|
2004
|
-
}
|
2005
|
-
}
|
2006
|
-
|
2007
|
-
function hasOverflow(element) {
|
2008
|
-
const overflowRegex = /(auto|scroll)/;
|
2009
|
-
const computedStyles = getComputedStyle(element, null);
|
2010
|
-
const overflow = computedStyles.getPropertyValue('overflow') + computedStyles.getPropertyValue('overflow-y') + computedStyles.getPropertyValue('overflow-x');
|
2011
|
-
return overflowRegex.test(overflow);
|
2012
|
-
}
|
2013
|
-
|
2014
|
-
function isStaticallyPositioned(element) {
|
2015
|
-
const position = getComputedStyle(element).getPropertyValue('position');
|
2016
|
-
return position === 'static';
|
2017
|
-
}
|
2018
|
-
|
2019
|
-
function closestScrollableElement(element) {
|
2020
|
-
if (!element) {
|
2021
|
-
return getDocumentScrollingElement();
|
2022
|
-
}
|
2023
|
-
const position = getComputedStyle(element).getPropertyValue('position');
|
2024
|
-
const excludeStaticParents = position === 'absolute';
|
2025
|
-
const scrollableElement = closest(element, parent => {
|
2026
|
-
if (excludeStaticParents && isStaticallyPositioned(parent)) {
|
2027
|
-
return false;
|
2028
|
-
}
|
2029
|
-
return hasOverflow(parent);
|
2030
|
-
});
|
2031
|
-
if (position === 'fixed' || !scrollableElement) {
|
2032
|
-
return getDocumentScrollingElement();
|
2033
|
-
} else {
|
2034
|
-
return scrollableElement;
|
2035
|
-
}
|
2036
|
-
}
|
2037
|
-
|
2038
|
-
function getDocumentScrollingElement() {
|
2039
|
-
return document.scrollingElement || document.documentElement;
|
2040
|
-
}
|
2041
|
-
|
2042
|
-
class Emitter {
|
2043
|
-
constructor() {
|
2044
|
-
this.callbacks = {};
|
2045
|
-
}
|
2046
|
-
|
2047
|
-
on(type, ...callbacks) {
|
2048
|
-
if (!this.callbacks[type]) {
|
2049
|
-
this.callbacks[type] = [];
|
2050
|
-
}
|
2051
|
-
this.callbacks[type].push(...callbacks);
|
2052
|
-
return this;
|
2053
|
-
}
|
2054
|
-
|
2055
|
-
off(type, callback) {
|
2056
|
-
if (!this.callbacks[type]) {
|
2057
|
-
return null;
|
2058
|
-
}
|
2059
|
-
const copy = this.callbacks[type].slice(0);
|
2060
|
-
for (let i = 0; i < copy.length; i++) {
|
2061
|
-
if (callback === copy[i]) {
|
2062
|
-
this.callbacks[type].splice(i, 1);
|
2063
|
-
}
|
2064
|
-
}
|
2065
|
-
return this;
|
2066
|
-
}
|
2067
|
-
|
2068
|
-
trigger(event) {
|
2069
|
-
if (!this.callbacks[event.type]) {
|
2070
|
-
return null;
|
2071
|
-
}
|
2072
|
-
const callbacks = [...this.callbacks[event.type]];
|
2073
|
-
const caughtErrors = [];
|
2074
|
-
for (let i = callbacks.length - 1; i >= 0; i--) {
|
2075
|
-
const callback = callbacks[i];
|
2076
|
-
try {
|
2077
|
-
callback(event);
|
2078
|
-
} catch (error) {
|
2079
|
-
caughtErrors.push(error);
|
2080
|
-
}
|
2081
|
-
}
|
2082
|
-
if (caughtErrors.length) {
|
2083
|
-
|
2084
|
-
console.error(`Draggable caught errors while triggering '${event.type}'`, caughtErrors);
|
2085
|
-
|
2086
|
-
}
|
2087
|
-
|
2088
|
-
return this;
|
2089
|
-
}
|
2090
|
-
}
|
2091
|
-
|
2092
|
-
class DraggableEvent extends AbstractEvent {
|
2093
|
-
|
2094
|
-
get draggable() {
|
2095
|
-
return this.data.draggable;
|
2096
|
-
}
|
2097
|
-
}
|
2098
|
-
|
2099
|
-
DraggableEvent.type = 'draggable';
|
2100
|
-
class DraggableInitializedEvent extends DraggableEvent {}
|
2101
|
-
|
2102
|
-
DraggableInitializedEvent.type = 'draggable:initialize';
|
2103
|
-
class DraggableDestroyEvent extends DraggableEvent {}
|
2104
|
-
DraggableDestroyEvent.type = 'draggable:destroy';
|
2105
|
-
|
2106
|
-
const onDragStart$1 = Symbol('onDragStart');
|
2107
|
-
const onDragMove = Symbol('onDragMove');
|
2108
|
-
const onDragStop$1 = Symbol('onDragStop');
|
2109
|
-
const onDragPressure = Symbol('onDragPressure');
|
2110
|
-
const dragStop = Symbol('dragStop');
|
2111
|
-
|
2112
|
-
const defaultAnnouncements$1 = {
|
2113
|
-
'drag:start': event => `Picked up ${event.source.textContent.trim() || event.source.id || 'draggable element'}`,
|
2114
|
-
'drag:stop': event => `Released ${event.source.textContent.trim() || event.source.id || 'draggable element'}`
|
2115
|
-
};
|
2116
|
-
const defaultClasses = {
|
2117
|
-
'container:dragging': 'draggable-container--is-dragging',
|
2118
|
-
'source:dragging': 'draggable-source--is-dragging',
|
2119
|
-
'source:placed': 'draggable-source--placed',
|
2120
|
-
'container:placed': 'draggable-container--placed',
|
2121
|
-
'body:dragging': 'draggable--is-dragging',
|
2122
|
-
'draggable:over': 'draggable--over',
|
2123
|
-
'container:over': 'draggable-container--over',
|
2124
|
-
'source:original': 'draggable--original',
|
2125
|
-
mirror: 'draggable-mirror'
|
2126
|
-
};
|
2127
|
-
const defaultOptions = {
|
2128
|
-
draggable: '.draggable-source',
|
2129
|
-
handle: null,
|
2130
|
-
delay: {},
|
2131
|
-
distance: 0,
|
2132
|
-
placedTimeout: 800,
|
2133
|
-
plugins: [],
|
2134
|
-
sensors: [],
|
2135
|
-
exclude: {
|
2136
|
-
plugins: [],
|
2137
|
-
sensors: []
|
2138
|
-
}
|
2139
|
-
};
|
2140
|
-
|
2141
|
-
class Draggable {
|
2142
|
-
|
2143
|
-
constructor(containers = [document.body], options = {}) {
|
2144
|
-
|
2145
|
-
if (containers instanceof NodeList || containers instanceof Array) {
|
2146
|
-
this.containers = [...containers];
|
2147
|
-
} else if (containers instanceof HTMLElement) {
|
2148
|
-
this.containers = [containers];
|
2149
|
-
} else {
|
2150
|
-
throw new Error('Draggable containers are expected to be of type `NodeList`, `HTMLElement[]` or `HTMLElement`');
|
2151
|
-
}
|
2152
|
-
this.options = {
|
2153
|
-
...defaultOptions,
|
2154
|
-
...options,
|
2155
|
-
classes: {
|
2156
|
-
...defaultClasses,
|
2157
|
-
...(options.classes || {})
|
2158
|
-
},
|
2159
|
-
announcements: {
|
2160
|
-
...defaultAnnouncements$1,
|
2161
|
-
...(options.announcements || {})
|
2162
|
-
},
|
2163
|
-
exclude: {
|
2164
|
-
plugins: options.exclude && options.exclude.plugins || [],
|
2165
|
-
sensors: options.exclude && options.exclude.sensors || []
|
2166
|
-
}
|
2167
|
-
};
|
2168
|
-
|
2169
|
-
this.emitter = new Emitter();
|
2170
|
-
|
2171
|
-
this.dragging = false;
|
2172
|
-
|
2173
|
-
this.plugins = [];
|
2174
|
-
|
2175
|
-
this.sensors = [];
|
2176
|
-
this[onDragStart$1] = this[onDragStart$1].bind(this);
|
2177
|
-
this[onDragMove] = this[onDragMove].bind(this);
|
2178
|
-
this[onDragStop$1] = this[onDragStop$1].bind(this);
|
2179
|
-
this[onDragPressure] = this[onDragPressure].bind(this);
|
2180
|
-
this[dragStop] = this[dragStop].bind(this);
|
2181
|
-
document.addEventListener('drag:start', this[onDragStart$1], true);
|
2182
|
-
document.addEventListener('drag:move', this[onDragMove], true);
|
2183
|
-
document.addEventListener('drag:stop', this[onDragStop$1], true);
|
2184
|
-
document.addEventListener('drag:pressure', this[onDragPressure], true);
|
2185
|
-
const defaultPlugins = Object.values(Draggable.Plugins).filter(Plugin => !this.options.exclude.plugins.includes(Plugin));
|
2186
|
-
const defaultSensors = Object.values(Draggable.Sensors).filter(sensor => !this.options.exclude.sensors.includes(sensor));
|
2187
|
-
this.addPlugin(...[...defaultPlugins, ...this.options.plugins]);
|
2188
|
-
this.addSensor(...[...defaultSensors, ...this.options.sensors]);
|
2189
|
-
const draggableInitializedEvent = new DraggableInitializedEvent({
|
2190
|
-
draggable: this
|
2191
|
-
});
|
2192
|
-
this.on('mirror:created', ({
|
2193
|
-
mirror
|
2194
|
-
}) => this.mirror = mirror);
|
2195
|
-
this.on('mirror:destroy', () => this.mirror = null);
|
2196
|
-
this.trigger(draggableInitializedEvent);
|
2197
|
-
}
|
2198
|
-
|
2199
|
-
destroy() {
|
2200
|
-
document.removeEventListener('drag:start', this[onDragStart$1], true);
|
2201
|
-
document.removeEventListener('drag:move', this[onDragMove], true);
|
2202
|
-
document.removeEventListener('drag:stop', this[onDragStop$1], true);
|
2203
|
-
document.removeEventListener('drag:pressure', this[onDragPressure], true);
|
2204
|
-
const draggableDestroyEvent = new DraggableDestroyEvent({
|
2205
|
-
draggable: this
|
2206
|
-
});
|
2207
|
-
this.trigger(draggableDestroyEvent);
|
2208
|
-
this.removePlugin(...this.plugins.map(plugin => plugin.constructor));
|
2209
|
-
this.removeSensor(...this.sensors.map(sensor => sensor.constructor));
|
2210
|
-
}
|
2211
|
-
|
2212
|
-
addPlugin(...plugins) {
|
2213
|
-
const activePlugins = plugins.map(Plugin => new Plugin(this));
|
2214
|
-
activePlugins.forEach(plugin => plugin.attach());
|
2215
|
-
this.plugins = [...this.plugins, ...activePlugins];
|
2216
|
-
return this;
|
2217
|
-
}
|
2218
|
-
|
2219
|
-
removePlugin(...plugins) {
|
2220
|
-
const removedPlugins = this.plugins.filter(plugin => plugins.includes(plugin.constructor));
|
2221
|
-
removedPlugins.forEach(plugin => plugin.detach());
|
2222
|
-
this.plugins = this.plugins.filter(plugin => !plugins.includes(plugin.constructor));
|
2223
|
-
return this;
|
2224
|
-
}
|
2225
|
-
|
2226
|
-
addSensor(...sensors) {
|
2227
|
-
const activeSensors = sensors.map(Sensor => new Sensor(this.containers, this.options));
|
2228
|
-
activeSensors.forEach(sensor => sensor.attach());
|
2229
|
-
this.sensors = [...this.sensors, ...activeSensors];
|
2230
|
-
return this;
|
2231
|
-
}
|
2232
|
-
|
2233
|
-
removeSensor(...sensors) {
|
2234
|
-
const removedSensors = this.sensors.filter(sensor => sensors.includes(sensor.constructor));
|
2235
|
-
removedSensors.forEach(sensor => sensor.detach());
|
2236
|
-
this.sensors = this.sensors.filter(sensor => !sensors.includes(sensor.constructor));
|
2237
|
-
return this;
|
2238
|
-
}
|
2239
|
-
|
2240
|
-
addContainer(...containers) {
|
2241
|
-
this.containers = [...this.containers, ...containers];
|
2242
|
-
this.sensors.forEach(sensor => sensor.addContainer(...containers));
|
2243
|
-
return this;
|
2244
|
-
}
|
2245
|
-
|
2246
|
-
removeContainer(...containers) {
|
2247
|
-
this.containers = this.containers.filter(container => !containers.includes(container));
|
2248
|
-
this.sensors.forEach(sensor => sensor.removeContainer(...containers));
|
2249
|
-
return this;
|
2250
|
-
}
|
2251
|
-
|
2252
|
-
on(type, ...callbacks) {
|
2253
|
-
this.emitter.on(type, ...callbacks);
|
2254
|
-
return this;
|
2255
|
-
}
|
2256
|
-
|
2257
|
-
off(type, callback) {
|
2258
|
-
this.emitter.off(type, callback);
|
2259
|
-
return this;
|
2260
|
-
}
|
2261
|
-
|
2262
|
-
trigger(event) {
|
2263
|
-
this.emitter.trigger(event);
|
2264
|
-
return this;
|
2265
|
-
}
|
2266
|
-
|
2267
|
-
getClassNameFor(name) {
|
2268
|
-
return this.getClassNamesFor(name)[0];
|
2269
|
-
}
|
2270
|
-
|
2271
|
-
getClassNamesFor(name) {
|
2272
|
-
const classNames = this.options.classes[name];
|
2273
|
-
if (classNames instanceof Array) {
|
2274
|
-
return classNames;
|
2275
|
-
} else if (typeof classNames === 'string' || classNames instanceof String) {
|
2276
|
-
return [classNames];
|
2277
|
-
} else {
|
2278
|
-
return [];
|
2279
|
-
}
|
2280
|
-
}
|
2281
|
-
|
2282
|
-
isDragging() {
|
2283
|
-
return Boolean(this.dragging);
|
2284
|
-
}
|
2285
|
-
|
2286
|
-
getDraggableElements() {
|
2287
|
-
return this.containers.reduce((current, container) => {
|
2288
|
-
return [...current, ...this.getDraggableElementsForContainer(container)];
|
2289
|
-
}, []);
|
2290
|
-
}
|
2291
|
-
|
2292
|
-
getDraggableElementsForContainer(container) {
|
2293
|
-
const allDraggableElements = container.querySelectorAll(this.options.draggable);
|
2294
|
-
return [...allDraggableElements].filter(childElement => {
|
2295
|
-
return childElement !== this.originalSource && childElement !== this.mirror;
|
2296
|
-
});
|
2297
|
-
}
|
2298
|
-
|
2299
|
-
cancel() {
|
2300
|
-
this[dragStop]();
|
2301
|
-
}
|
2302
|
-
|
2303
|
-
[onDragStart$1](event) {
|
2304
|
-
const sensorEvent = getSensorEvent(event);
|
2305
|
-
const {
|
2306
|
-
target,
|
2307
|
-
container,
|
2308
|
-
originalSource
|
2309
|
-
} = sensorEvent;
|
2310
|
-
if (!this.containers.includes(container)) {
|
2311
|
-
return;
|
2312
|
-
}
|
2313
|
-
if (this.options.handle && target && !closest(target, this.options.handle)) {
|
2314
|
-
sensorEvent.cancel();
|
2315
|
-
return;
|
2316
|
-
}
|
2317
|
-
this.originalSource = originalSource;
|
2318
|
-
this.sourceContainer = container;
|
2319
|
-
if (this.lastPlacedSource && this.lastPlacedContainer) {
|
2320
|
-
clearTimeout(this.placedTimeoutID);
|
2321
|
-
this.lastPlacedSource.classList.remove(...this.getClassNamesFor('source:placed'));
|
2322
|
-
this.lastPlacedContainer.classList.remove(...this.getClassNamesFor('container:placed'));
|
2323
|
-
}
|
2324
|
-
this.source = this.originalSource.cloneNode(true);
|
2325
|
-
this.originalSource.parentNode.insertBefore(this.source, this.originalSource);
|
2326
|
-
this.originalSource.style.display = 'none';
|
2327
|
-
const dragStartEvent = new DragStartEvent({
|
2328
|
-
source: this.source,
|
2329
|
-
originalSource: this.originalSource,
|
2330
|
-
sourceContainer: container,
|
2331
|
-
sensorEvent
|
2332
|
-
});
|
2333
|
-
this.trigger(dragStartEvent);
|
2334
|
-
this.dragging = !dragStartEvent.canceled();
|
2335
|
-
if (dragStartEvent.canceled()) {
|
2336
|
-
this.source.remove();
|
2337
|
-
this.originalSource.style.display = null;
|
2338
|
-
return;
|
2339
|
-
}
|
2340
|
-
this.originalSource.classList.add(...this.getClassNamesFor('source:original'));
|
2341
|
-
this.source.classList.add(...this.getClassNamesFor('source:dragging'));
|
2342
|
-
this.sourceContainer.classList.add(...this.getClassNamesFor('container:dragging'));
|
2343
|
-
document.body.classList.add(...this.getClassNamesFor('body:dragging'));
|
2344
|
-
applyUserSelect(document.body, 'none');
|
2345
|
-
requestAnimationFrame(() => {
|
2346
|
-
const oldSensorEvent = getSensorEvent(event);
|
2347
|
-
const newSensorEvent = oldSensorEvent.clone({
|
2348
|
-
target: this.source
|
2349
|
-
});
|
2350
|
-
this[onDragMove]({
|
2351
|
-
...event,
|
2352
|
-
detail: newSensorEvent
|
2353
|
-
});
|
2354
|
-
});
|
2355
|
-
}
|
2356
|
-
|
2357
|
-
[onDragMove](event) {
|
2358
|
-
if (!this.dragging) {
|
2359
|
-
return;
|
2360
|
-
}
|
2361
|
-
const sensorEvent = getSensorEvent(event);
|
2362
|
-
const {
|
2363
|
-
container
|
2364
|
-
} = sensorEvent;
|
2365
|
-
let target = sensorEvent.target;
|
2366
|
-
const dragMoveEvent = new DragMoveEvent({
|
2367
|
-
source: this.source,
|
2368
|
-
originalSource: this.originalSource,
|
2369
|
-
sourceContainer: container,
|
2370
|
-
sensorEvent
|
2371
|
-
});
|
2372
|
-
this.trigger(dragMoveEvent);
|
2373
|
-
if (dragMoveEvent.canceled()) {
|
2374
|
-
sensorEvent.cancel();
|
2375
|
-
}
|
2376
|
-
target = closest(target, this.options.draggable);
|
2377
|
-
const withinCorrectContainer = closest(sensorEvent.target, this.containers);
|
2378
|
-
const overContainer = sensorEvent.overContainer || withinCorrectContainer;
|
2379
|
-
const isLeavingContainer = this.currentOverContainer && overContainer !== this.currentOverContainer;
|
2380
|
-
const isLeavingDraggable = this.currentOver && target !== this.currentOver;
|
2381
|
-
const isOverContainer = overContainer && this.currentOverContainer !== overContainer;
|
2382
|
-
const isOverDraggable = withinCorrectContainer && target && this.currentOver !== target;
|
2383
|
-
if (isLeavingDraggable) {
|
2384
|
-
const dragOutEvent = new DragOutEvent({
|
2385
|
-
source: this.source,
|
2386
|
-
originalSource: this.originalSource,
|
2387
|
-
sourceContainer: container,
|
2388
|
-
sensorEvent,
|
2389
|
-
over: this.currentOver,
|
2390
|
-
overContainer: this.currentOverContainer
|
2391
|
-
});
|
2392
|
-
this.currentOver.classList.remove(...this.getClassNamesFor('draggable:over'));
|
2393
|
-
this.currentOver = null;
|
2394
|
-
this.trigger(dragOutEvent);
|
2395
|
-
}
|
2396
|
-
if (isLeavingContainer) {
|
2397
|
-
const dragOutContainerEvent = new DragOutContainerEvent({
|
2398
|
-
source: this.source,
|
2399
|
-
originalSource: this.originalSource,
|
2400
|
-
sourceContainer: container,
|
2401
|
-
sensorEvent,
|
2402
|
-
overContainer: this.currentOverContainer
|
2403
|
-
});
|
2404
|
-
this.currentOverContainer.classList.remove(...this.getClassNamesFor('container:over'));
|
2405
|
-
this.currentOverContainer = null;
|
2406
|
-
this.trigger(dragOutContainerEvent);
|
2407
|
-
}
|
2408
|
-
if (isOverContainer) {
|
2409
|
-
overContainer.classList.add(...this.getClassNamesFor('container:over'));
|
2410
|
-
const dragOverContainerEvent = new DragOverContainerEvent({
|
2411
|
-
source: this.source,
|
2412
|
-
originalSource: this.originalSource,
|
2413
|
-
sourceContainer: container,
|
2414
|
-
sensorEvent,
|
2415
|
-
overContainer
|
2416
|
-
});
|
2417
|
-
this.currentOverContainer = overContainer;
|
2418
|
-
this.trigger(dragOverContainerEvent);
|
2419
|
-
}
|
2420
|
-
if (isOverDraggable) {
|
2421
|
-
target.classList.add(...this.getClassNamesFor('draggable:over'));
|
2422
|
-
const dragOverEvent = new DragOverEvent({
|
2423
|
-
source: this.source,
|
2424
|
-
originalSource: this.originalSource,
|
2425
|
-
sourceContainer: container,
|
2426
|
-
sensorEvent,
|
2427
|
-
overContainer,
|
2428
|
-
over: target
|
2429
|
-
});
|
2430
|
-
this.currentOver = target;
|
2431
|
-
this.trigger(dragOverEvent);
|
2432
|
-
}
|
2433
|
-
}
|
2434
|
-
|
2435
|
-
[dragStop](event) {
|
2436
|
-
if (!this.dragging) {
|
2437
|
-
return;
|
2438
|
-
}
|
2439
|
-
this.dragging = false;
|
2440
|
-
const dragStopEvent = new DragStopEvent({
|
2441
|
-
source: this.source,
|
2442
|
-
originalSource: this.originalSource,
|
2443
|
-
sensorEvent: event ? event.sensorEvent : null,
|
2444
|
-
sourceContainer: this.sourceContainer
|
2445
|
-
});
|
2446
|
-
this.trigger(dragStopEvent);
|
2447
|
-
if (!dragStopEvent.canceled()) this.source.parentNode.insertBefore(this.originalSource, this.source);
|
2448
|
-
this.source.remove();
|
2449
|
-
this.originalSource.style.display = '';
|
2450
|
-
this.source.classList.remove(...this.getClassNamesFor('source:dragging'));
|
2451
|
-
this.originalSource.classList.remove(...this.getClassNamesFor('source:original'));
|
2452
|
-
this.originalSource.classList.add(...this.getClassNamesFor('source:placed'));
|
2453
|
-
this.sourceContainer.classList.add(...this.getClassNamesFor('container:placed'));
|
2454
|
-
this.sourceContainer.classList.remove(...this.getClassNamesFor('container:dragging'));
|
2455
|
-
document.body.classList.remove(...this.getClassNamesFor('body:dragging'));
|
2456
|
-
applyUserSelect(document.body, '');
|
2457
|
-
if (this.currentOver) {
|
2458
|
-
this.currentOver.classList.remove(...this.getClassNamesFor('draggable:over'));
|
2459
|
-
}
|
2460
|
-
if (this.currentOverContainer) {
|
2461
|
-
this.currentOverContainer.classList.remove(...this.getClassNamesFor('container:over'));
|
2462
|
-
}
|
2463
|
-
this.lastPlacedSource = this.originalSource;
|
2464
|
-
this.lastPlacedContainer = this.sourceContainer;
|
2465
|
-
this.placedTimeoutID = setTimeout(() => {
|
2466
|
-
if (this.lastPlacedSource) {
|
2467
|
-
this.lastPlacedSource.classList.remove(...this.getClassNamesFor('source:placed'));
|
2468
|
-
}
|
2469
|
-
if (this.lastPlacedContainer) {
|
2470
|
-
this.lastPlacedContainer.classList.remove(...this.getClassNamesFor('container:placed'));
|
2471
|
-
}
|
2472
|
-
this.lastPlacedSource = null;
|
2473
|
-
this.lastPlacedContainer = null;
|
2474
|
-
}, this.options.placedTimeout);
|
2475
|
-
const dragStoppedEvent = new DragStoppedEvent({
|
2476
|
-
source: this.source,
|
2477
|
-
originalSource: this.originalSource,
|
2478
|
-
sensorEvent: event ? event.sensorEvent : null,
|
2479
|
-
sourceContainer: this.sourceContainer
|
2480
|
-
});
|
2481
|
-
this.trigger(dragStoppedEvent);
|
2482
|
-
this.source = null;
|
2483
|
-
this.originalSource = null;
|
2484
|
-
this.currentOverContainer = null;
|
2485
|
-
this.currentOver = null;
|
2486
|
-
this.sourceContainer = null;
|
2487
|
-
}
|
2488
|
-
|
2489
|
-
[onDragStop$1](event) {
|
2490
|
-
this[dragStop](event);
|
2491
|
-
}
|
2492
|
-
|
2493
|
-
[onDragPressure](event) {
|
2494
|
-
if (!this.dragging) {
|
2495
|
-
return;
|
2496
|
-
}
|
2497
|
-
const sensorEvent = getSensorEvent(event);
|
2498
|
-
const source = this.source || closest(sensorEvent.originalEvent.target, this.options.draggable);
|
2499
|
-
const dragPressureEvent = new DragPressureEvent({
|
2500
|
-
sensorEvent,
|
2501
|
-
source,
|
2502
|
-
pressure: sensorEvent.pressure
|
2503
|
-
});
|
2504
|
-
this.trigger(dragPressureEvent);
|
2505
|
-
}
|
2506
|
-
}
|
2507
|
-
|
2508
|
-
Draggable.Plugins = {
|
2509
|
-
Announcement,
|
2510
|
-
Focusable,
|
2511
|
-
Mirror,
|
2512
|
-
Scrollable
|
2513
|
-
};
|
2514
|
-
|
2515
|
-
Draggable.Sensors = {
|
2516
|
-
MouseSensor,
|
2517
|
-
TouchSensor
|
2518
|
-
};
|
2519
|
-
function getSensorEvent(event) {
|
2520
|
-
return event.detail;
|
2521
|
-
}
|
2522
|
-
function applyUserSelect(element, value) {
|
2523
|
-
element.style.webkitUserSelect = value;
|
2524
|
-
element.style.mozUserSelect = value;
|
2525
|
-
element.style.msUserSelect = value;
|
2526
|
-
element.style.oUserSelect = value;
|
2527
|
-
element.style.userSelect = value;
|
2528
|
-
}
|
2529
|
-
|
2530
|
-
class SortableEvent extends AbstractEvent {
|
2531
|
-
|
2532
|
-
constructor(data) {
|
2533
|
-
super(data);
|
2534
|
-
this.data = data;
|
2535
|
-
}
|
2536
|
-
|
2537
|
-
get dragEvent() {
|
2538
|
-
return this.data.dragEvent;
|
2539
|
-
}
|
2540
|
-
}
|
2541
|
-
SortableEvent.type = 'sortable';
|
2542
|
-
|
2543
|
-
class SortableStartEvent extends SortableEvent {
|
2544
|
-
|
2545
|
-
get startIndex() {
|
2546
|
-
return this.data.startIndex;
|
2547
|
-
}
|
2548
|
-
|
2549
|
-
get startContainer() {
|
2550
|
-
return this.data.startContainer;
|
2551
|
-
}
|
2552
|
-
}
|
2553
|
-
SortableStartEvent.type = 'sortable:start';
|
2554
|
-
SortableStartEvent.cancelable = true;
|
2555
|
-
|
2556
|
-
class SortableSortEvent extends SortableEvent {
|
2557
|
-
|
2558
|
-
get currentIndex() {
|
2559
|
-
return this.data.currentIndex;
|
2560
|
-
}
|
2561
|
-
|
2562
|
-
get over() {
|
2563
|
-
return this.data.over;
|
2564
|
-
}
|
2565
|
-
|
2566
|
-
get overContainer() {
|
2567
|
-
return this.data.dragEvent.overContainer;
|
2568
|
-
}
|
2569
|
-
}
|
2570
|
-
SortableSortEvent.type = 'sortable:sort';
|
2571
|
-
SortableSortEvent.cancelable = true;
|
2572
|
-
|
2573
|
-
class SortableSortedEvent extends SortableEvent {
|
2574
|
-
|
2575
|
-
get oldIndex() {
|
2576
|
-
return this.data.oldIndex;
|
2577
|
-
}
|
2578
|
-
|
2579
|
-
get newIndex() {
|
2580
|
-
return this.data.newIndex;
|
2581
|
-
}
|
2582
|
-
|
2583
|
-
get oldContainer() {
|
2584
|
-
return this.data.oldContainer;
|
2585
|
-
}
|
2586
|
-
|
2587
|
-
get newContainer() {
|
2588
|
-
return this.data.newContainer;
|
2589
|
-
}
|
2590
|
-
}
|
2591
|
-
SortableSortedEvent.type = 'sortable:sorted';
|
2592
|
-
|
2593
|
-
class SortableStopEvent extends SortableEvent {
|
2594
|
-
|
2595
|
-
get oldIndex() {
|
2596
|
-
return this.data.oldIndex;
|
2597
|
-
}
|
2598
|
-
|
2599
|
-
get newIndex() {
|
2600
|
-
return this.data.newIndex;
|
2601
|
-
}
|
2602
|
-
|
2603
|
-
get oldContainer() {
|
2604
|
-
return this.data.oldContainer;
|
2605
|
-
}
|
2606
|
-
|
2607
|
-
get newContainer() {
|
2608
|
-
return this.data.newContainer;
|
2609
|
-
}
|
2610
|
-
}
|
2611
|
-
SortableStopEvent.type = 'sortable:stop';
|
2612
|
-
|
2613
|
-
const onDragStart = Symbol('onDragStart');
|
2614
|
-
const onDragOverContainer = Symbol('onDragOverContainer');
|
2615
|
-
const onDragOver = Symbol('onDragOver');
|
2616
|
-
const onDragStop = Symbol('onDragStop');
|
2617
|
-
|
2618
|
-
function onSortableSortedDefaultAnnouncement({
|
2619
|
-
dragEvent
|
2620
|
-
}) {
|
2621
|
-
const sourceText = dragEvent.source.textContent.trim() || dragEvent.source.id || 'sortable element';
|
2622
|
-
if (dragEvent.over) {
|
2623
|
-
const overText = dragEvent.over.textContent.trim() || dragEvent.over.id || 'sortable element';
|
2624
|
-
const isFollowing = dragEvent.source.compareDocumentPosition(dragEvent.over) & Node.DOCUMENT_POSITION_FOLLOWING;
|
2625
|
-
if (isFollowing) {
|
2626
|
-
return `Placed ${sourceText} after ${overText}`;
|
2627
|
-
} else {
|
2628
|
-
return `Placed ${sourceText} before ${overText}`;
|
2629
|
-
}
|
2630
|
-
} else {
|
2631
|
-
|
2632
|
-
return `Placed ${sourceText} into a different container`;
|
2633
|
-
}
|
2634
|
-
}
|
2635
|
-
|
2636
|
-
const defaultAnnouncements = {
|
2637
|
-
'sortable:sorted': onSortableSortedDefaultAnnouncement
|
2638
|
-
};
|
2639
|
-
|
2640
|
-
class Sortable extends Draggable {
|
2641
|
-
|
2642
|
-
constructor(containers = [], options = {}) {
|
2643
|
-
super(containers, {
|
2644
|
-
...options,
|
2645
|
-
announcements: {
|
2646
|
-
...defaultAnnouncements,
|
2647
|
-
...(options.announcements || {})
|
2648
|
-
}
|
2649
|
-
});
|
2650
|
-
|
2651
|
-
this.startIndex = null;
|
2652
|
-
|
2653
|
-
this.startContainer = null;
|
2654
|
-
this[onDragStart] = this[onDragStart].bind(this);
|
2655
|
-
this[onDragOverContainer] = this[onDragOverContainer].bind(this);
|
2656
|
-
this[onDragOver] = this[onDragOver].bind(this);
|
2657
|
-
this[onDragStop] = this[onDragStop].bind(this);
|
2658
|
-
this.on('drag:start', this[onDragStart]).on('drag:over:container', this[onDragOverContainer]).on('drag:over', this[onDragOver]).on('drag:stop', this[onDragStop]);
|
2659
|
-
}
|
2660
|
-
|
2661
|
-
destroy() {
|
2662
|
-
super.destroy();
|
2663
|
-
this.off('drag:start', this[onDragStart]).off('drag:over:container', this[onDragOverContainer]).off('drag:over', this[onDragOver]).off('drag:stop', this[onDragStop]);
|
2664
|
-
}
|
2665
|
-
|
2666
|
-
index(element) {
|
2667
|
-
return this.getSortableElementsForContainer(element.parentNode).indexOf(element);
|
2668
|
-
}
|
2669
|
-
|
2670
|
-
getSortableElementsForContainer(container) {
|
2671
|
-
const allSortableElements = container.querySelectorAll(this.options.draggable);
|
2672
|
-
return [...allSortableElements].filter(childElement => {
|
2673
|
-
return childElement !== this.originalSource && childElement !== this.mirror && childElement.parentNode === container;
|
2674
|
-
});
|
2675
|
-
}
|
2676
|
-
|
2677
|
-
[onDragStart](event) {
|
2678
|
-
this.startContainer = event.source.parentNode;
|
2679
|
-
this.startIndex = this.index(event.source);
|
2680
|
-
const sortableStartEvent = new SortableStartEvent({
|
2681
|
-
dragEvent: event,
|
2682
|
-
startIndex: this.startIndex,
|
2683
|
-
startContainer: this.startContainer
|
2684
|
-
});
|
2685
|
-
this.trigger(sortableStartEvent);
|
2686
|
-
if (sortableStartEvent.canceled()) {
|
2687
|
-
event.cancel();
|
2688
|
-
}
|
2689
|
-
}
|
2690
|
-
|
2691
|
-
[onDragOverContainer](event) {
|
2692
|
-
if (event.canceled()) {
|
2693
|
-
return;
|
2694
|
-
}
|
2695
|
-
const {
|
2696
|
-
source,
|
2697
|
-
over,
|
2698
|
-
overContainer
|
2699
|
-
} = event;
|
2700
|
-
const oldIndex = this.index(source);
|
2701
|
-
const sortableSortEvent = new SortableSortEvent({
|
2702
|
-
dragEvent: event,
|
2703
|
-
currentIndex: oldIndex,
|
2704
|
-
source,
|
2705
|
-
over
|
2706
|
-
});
|
2707
|
-
this.trigger(sortableSortEvent);
|
2708
|
-
if (sortableSortEvent.canceled()) {
|
2709
|
-
return;
|
2710
|
-
}
|
2711
|
-
const children = this.getSortableElementsForContainer(overContainer);
|
2712
|
-
const moves = move({
|
2713
|
-
source,
|
2714
|
-
over,
|
2715
|
-
overContainer,
|
2716
|
-
children
|
2717
|
-
});
|
2718
|
-
if (!moves) {
|
2719
|
-
return;
|
2720
|
-
}
|
2721
|
-
const {
|
2722
|
-
oldContainer,
|
2723
|
-
newContainer
|
2724
|
-
} = moves;
|
2725
|
-
const newIndex = this.index(event.source);
|
2726
|
-
const sortableSortedEvent = new SortableSortedEvent({
|
2727
|
-
dragEvent: event,
|
2728
|
-
oldIndex,
|
2729
|
-
newIndex,
|
2730
|
-
oldContainer,
|
2731
|
-
newContainer
|
2732
|
-
});
|
2733
|
-
this.trigger(sortableSortedEvent);
|
2734
|
-
}
|
2735
|
-
|
2736
|
-
[onDragOver](event) {
|
2737
|
-
if (event.over === event.originalSource || event.over === event.source) {
|
2738
|
-
return;
|
2739
|
-
}
|
2740
|
-
const {
|
2741
|
-
source,
|
2742
|
-
over,
|
2743
|
-
overContainer
|
2744
|
-
} = event;
|
2745
|
-
const oldIndex = this.index(source);
|
2746
|
-
const sortableSortEvent = new SortableSortEvent({
|
2747
|
-
dragEvent: event,
|
2748
|
-
currentIndex: oldIndex,
|
2749
|
-
source,
|
2750
|
-
over
|
2751
|
-
});
|
2752
|
-
this.trigger(sortableSortEvent);
|
2753
|
-
if (sortableSortEvent.canceled()) {
|
2754
|
-
return;
|
2755
|
-
}
|
2756
|
-
const children = this.getDraggableElementsForContainer(overContainer);
|
2757
|
-
const moves = move({
|
2758
|
-
source,
|
2759
|
-
over,
|
2760
|
-
overContainer,
|
2761
|
-
children
|
2762
|
-
});
|
2763
|
-
if (!moves) {
|
2764
|
-
return;
|
2765
|
-
}
|
2766
|
-
const {
|
2767
|
-
oldContainer,
|
2768
|
-
newContainer
|
2769
|
-
} = moves;
|
2770
|
-
const newIndex = this.index(source);
|
2771
|
-
const sortableSortedEvent = new SortableSortedEvent({
|
2772
|
-
dragEvent: event,
|
2773
|
-
oldIndex,
|
2774
|
-
newIndex,
|
2775
|
-
oldContainer,
|
2776
|
-
newContainer
|
2777
|
-
});
|
2778
|
-
this.trigger(sortableSortedEvent);
|
2779
|
-
}
|
2780
|
-
|
2781
|
-
[onDragStop](event) {
|
2782
|
-
const sortableStopEvent = new SortableStopEvent({
|
2783
|
-
dragEvent: event,
|
2784
|
-
oldIndex: this.startIndex,
|
2785
|
-
newIndex: this.index(event.source),
|
2786
|
-
oldContainer: this.startContainer,
|
2787
|
-
newContainer: event.source.parentNode
|
2788
|
-
});
|
2789
|
-
this.trigger(sortableStopEvent);
|
2790
|
-
this.startIndex = null;
|
2791
|
-
this.startContainer = null;
|
2792
|
-
}
|
2793
|
-
}
|
2794
|
-
function index(element) {
|
2795
|
-
return Array.prototype.indexOf.call(element.parentNode.children, element);
|
2796
|
-
}
|
2797
|
-
function move({
|
2798
|
-
source,
|
2799
|
-
over,
|
2800
|
-
overContainer,
|
2801
|
-
children
|
2802
|
-
}) {
|
2803
|
-
const emptyOverContainer = !children.length;
|
2804
|
-
const differentContainer = source.parentNode !== overContainer;
|
2805
|
-
const sameContainer = over && source.parentNode === over.parentNode;
|
2806
|
-
if (emptyOverContainer) {
|
2807
|
-
return moveInsideEmptyContainer(source, overContainer);
|
2808
|
-
} else if (sameContainer) {
|
2809
|
-
return moveWithinContainer(source, over);
|
2810
|
-
} else if (differentContainer) {
|
2811
|
-
return moveOutsideContainer(source, over, overContainer);
|
2812
|
-
} else {
|
2813
|
-
return null;
|
2814
|
-
}
|
2815
|
-
}
|
2816
|
-
function moveInsideEmptyContainer(source, overContainer) {
|
2817
|
-
const oldContainer = source.parentNode;
|
2818
|
-
overContainer.appendChild(source);
|
2819
|
-
return {
|
2820
|
-
oldContainer,
|
2821
|
-
newContainer: overContainer
|
2822
|
-
};
|
2823
|
-
}
|
2824
|
-
function moveWithinContainer(source, over) {
|
2825
|
-
const oldIndex = index(source);
|
2826
|
-
const newIndex = index(over);
|
2827
|
-
if (oldIndex < newIndex) {
|
2828
|
-
source.parentNode.insertBefore(source, over.nextElementSibling);
|
2829
|
-
} else {
|
2830
|
-
source.parentNode.insertBefore(source, over);
|
2831
|
-
}
|
2832
|
-
return {
|
2833
|
-
oldContainer: source.parentNode,
|
2834
|
-
newContainer: source.parentNode
|
2835
|
-
};
|
2836
|
-
}
|
2837
|
-
function moveOutsideContainer(source, over, overContainer) {
|
2838
|
-
const oldContainer = source.parentNode;
|
2839
|
-
if (over) {
|
2840
|
-
over.parentNode.insertBefore(source, over);
|
2841
|
-
} else {
|
2842
|
-
|
2843
|
-
overContainer.appendChild(source);
|
2844
|
-
}
|
2845
|
-
return {
|
2846
|
-
oldContainer,
|
2847
|
-
newContainer: source.parentNode
|
2848
|
-
};
|
2849
|
-
}
|
2850
|
-
|
2851
|
-
export { Sortable as S };
|