@ui5/webcomponents-base 2.14.0-rc.2 → 2.14.0-rc.4
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/CHANGELOG.md +23 -0
- package/dist/.tsbuildinfobuild +1 -1
- package/dist/custom-elements-internal.json +15 -15
- package/dist/custom-elements.json +15 -15
- package/dist/features/OpenUI5Support.js +2 -1
- package/dist/features/OpenUI5Support.js.map +1 -1
- package/dist/generated/VersionInfo.js +3 -3
- package/dist/generated/VersionInfo.js.map +1 -1
- package/dist/generated/json-imports/i18n-fetch.js +1 -1
- package/dist/generated/json-imports/i18n-fetch.js.map +1 -1
- package/dist/generated/json-imports/i18n-node.js +1 -1
- package/dist/generated/json-imports/i18n-node.js.map +1 -1
- package/dist/generated/json-imports/i18n.js +1 -1
- package/dist/generated/json-imports/i18n.js.map +1 -1
- package/dist/prod/features/OpenUI5Support.js +1 -1
- package/dist/prod/features/OpenUI5Support.js.map +2 -2
- package/dist/prod/generated/VersionInfo.js +1 -1
- package/dist/prod/generated/VersionInfo.js.map +1 -1
- package/dist/prod/generated/json-imports/i18n-fetch.js.map +2 -2
- package/dist/prod/generated/json-imports/i18n-node.js.map +2 -2
- package/dist/prod/generated/json-imports/i18n.js.map +2 -2
- package/dist/prod/theming/applyTheme.js.map +2 -2
- package/dist/prod/util/FocusableElements.js +1 -1
- package/dist/prod/util/FocusableElements.js.map +2 -2
- package/dist/prod/util/dragAndDrop/DragRegistry.js +1 -1
- package/dist/prod/util/dragAndDrop/DragRegistry.js.map +3 -3
- package/dist/theming/applyTheme.js +2 -1
- package/dist/theming/applyTheme.js.map +1 -1
- package/dist/util/FocusableElements.js +1 -1
- package/dist/util/FocusableElements.js.map +1 -1
- package/dist/util/dragAndDrop/DragRegistry.d.ts +5 -10
- package/dist/util/dragAndDrop/DragRegistry.js +15 -73
- package/dist/util/dragAndDrop/DragRegistry.js.map +1 -1
- package/package.json +3 -3
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/util/dragAndDrop/DragRegistry.ts"],
|
|
4
|
-
"sourcesContent": ["import type
|
|
5
|
-
"mappings": "
|
|
6
|
-
"names": ["MultipleDragGhostCss", "getI18nBundle", "DRAG_DROP_MULTIPLE_TEXT", "MIN_MULTI_DRAG_COUNT", "
|
|
4
|
+
"sourcesContent": ["import type MovePlacement from \"../../types/MovePlacement.js\";\nimport MultipleDragGhostCss from \"../../generated/css/MultipleDragGhost.css.js\";\n\nimport { getI18nBundle } from \"../../i18nBundle.js\";\n\nimport {\n\tDRAG_DROP_MULTIPLE_TEXT,\n} from \"../../generated/i18n/i18n-defaults.js\";\n\nconst MIN_MULTI_DRAG_COUNT = 2;\n\nlet draggedElement: HTMLElement | null = null;\n\nconst setDraggedElement = (element: HTMLElement | null) => {\n\tdraggedElement = element;\n};\n\nconst clearDraggedElement = () => {\n\tdraggedElement = null;\n};\n\nconst getDraggedElement = () => {\n\treturn draggedElement;\n};\n\nconst createDefaultMultiDragElement = async (count: number): Promise<HTMLElement> => {\n\tconst dragElement = document.createElement(\"div\");\n\tconst i18nBundle = await getI18nBundle(\"@ui5/webcomponents-base\");\n\n\tconst dragElementShadow = dragElement.attachShadow({ mode: \"open\" });\n\n\tconst styles = new CSSStyleSheet();\n\tstyles.replaceSync(MultipleDragGhostCss);\n\n\tdragElementShadow.adoptedStyleSheets = [styles];\n\tdragElementShadow.textContent = i18nBundle.getText(DRAG_DROP_MULTIPLE_TEXT, count);\n\n\treturn dragElement;\n};\n\n/**\n * Starts a multiple drag operation by creating a drag ghost element.\n * The drag ghost will be displayed when dragging multiple items.\n *\n * @param {number} count - The number of items being dragged.\n * @param {DragEvent} e - The drag event that triggered the operation.\n * @public\n */\nconst startMultipleDrag = async (count: number, e: DragEvent) => {\n\tif (count < MIN_MULTI_DRAG_COUNT) {\n\t\tconsole.warn(`Cannot start multiple drag with count ${count}. Minimum is ${MIN_MULTI_DRAG_COUNT}.`); // eslint-disable-line\n\t\treturn;\n\t}\n\n\tif (!e.dataTransfer) {\n\t\treturn;\n\t}\n\n\tconst customDragElement = await createDefaultMultiDragElement(count);\n\n\t// Add to document body temporarily\n\tdocument.body.appendChild(customDragElement);\n\n\te.dataTransfer.setDragImage(customDragElement, 0, 0);\n\n\t// Clean up the temporary element after the drag operation starts\n\trequestAnimationFrame(() => {\n\t\tcustomDragElement.remove();\n\t});\n};\n\ntype DragAndDropSettings = {\n\t/**\n\t * Allow cross-browser and file drag and drop.\n\t */\n\tcrossDnD?: boolean;\n\t/**\n\t * Pass the original event in the event parameters.\n\t */\n\toriginalEvent?: boolean;\n};\n\ntype MoveEventDetail = {\n\toriginalEvent: Event,\n\tsource: {\n\t\telement: HTMLElement,\n\t},\n\tdestination: {\n\t\telement: HTMLElement,\n\t\tplacement: `${MovePlacement}`,\n\t}\n};\n\nconst DragRegistry = {\n\tsetDraggedElement,\n\tclearDraggedElement,\n\tgetDraggedElement,\n\tstartMultipleDrag,\n};\n\nexport default DragRegistry;\nexport {\n\tstartMultipleDrag,\n};\n\nexport type {\n\tDragAndDropSettings,\n\tMoveEventDetail,\n};\n"],
|
|
5
|
+
"mappings": "aACA,OAAOA,MAA0B,+CAEjC,OAAS,iBAAAC,MAAqB,sBAE9B,OACC,2BAAAC,MACM,wCAEP,MAAMC,EAAuB,EAE7B,IAAIC,EAAqC,KAEzC,MAAMC,EAAqBC,GAAgC,CAC1DF,EAAiBE,CAClB,EAEMC,EAAsB,IAAM,CACjCH,EAAiB,IAClB,EAEMI,EAAoB,IAClBJ,EAGFK,EAAgC,MAAOC,GAAwC,CACpF,MAAMC,EAAc,SAAS,cAAc,KAAK,EAC1CC,EAAa,MAAMX,EAAc,yBAAyB,EAE1DY,EAAoBF,EAAY,aAAa,CAAE,KAAM,MAAO,CAAC,EAE7DG,EAAS,IAAI,cACnB,OAAAA,EAAO,YAAYd,CAAoB,EAEvCa,EAAkB,mBAAqB,CAACC,CAAM,EAC9CD,EAAkB,YAAcD,EAAW,QAAQV,EAAyBQ,CAAK,EAE1EC,CACR,EAUMI,EAAoB,MAAOL,EAAeM,IAAiB,CAChE,GAAIN,EAAQP,EAAsB,CACjC,QAAQ,KAAK,yCAAyCO,CAAK,gBAAgBP,CAAoB,GAAG,EAClG,MACD,CAEA,GAAI,CAACa,EAAE,aACN,OAGD,MAAMC,EAAoB,MAAMR,EAA8BC,CAAK,EAGnE,SAAS,KAAK,YAAYO,CAAiB,EAE3CD,EAAE,aAAa,aAAaC,EAAmB,EAAG,CAAC,EAGnD,sBAAsB,IAAM,CAC3BA,EAAkB,OAAO,CAC1B,CAAC,CACF,EAwBMC,EAAe,CACpB,kBAAAb,EACA,oBAAAE,EACA,kBAAAC,EACA,kBAAAO,CACD,EAEA,eAAeG,EACf,OACCH,KAAA",
|
|
6
|
+
"names": ["MultipleDragGhostCss", "getI18nBundle", "DRAG_DROP_MULTIPLE_TEXT", "MIN_MULTI_DRAG_COUNT", "draggedElement", "setDraggedElement", "element", "clearDraggedElement", "getDraggedElement", "createDefaultMultiDragElement", "count", "dragElement", "i18nBundle", "dragElementShadow", "styles", "startMultipleDrag", "e", "customDragElement", "DragRegistry"]
|
|
7
7
|
}
|
|
@@ -6,7 +6,8 @@ import { getFeature } from "../FeaturesRegistry.js";
|
|
|
6
6
|
import { attachCustomThemeStylesToHead, getThemeRoot } from "../config/ThemeRoot.js";
|
|
7
7
|
import { DEFAULT_THEME } from "../generated/AssetParameters.js";
|
|
8
8
|
import { getCurrentRuntimeIndex } from "../Runtimes.js";
|
|
9
|
-
|
|
9
|
+
// eslint-disable-next-line
|
|
10
|
+
const BASE_THEME_PACKAGE = "@" + "ui5" + "/" + "webcomponents-theming";
|
|
10
11
|
const isThemeBaseRegistered = () => {
|
|
11
12
|
const registeredPackages = getRegisteredPackages();
|
|
12
13
|
return registeredPackages.has(BASE_THEME_PACKAGE);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"applyTheme.js","sourceRoot":"","sources":["../../src/theming/applyTheme.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,qBAAqB,EAAE,iBAAiB,EAAE,MAAM,+BAA+B,CAAC;AAC7G,OAAO,EAAE,WAAW,EAAE,mBAAmB,EAAE,MAAM,qBAAqB,CAAC;AACvE,OAAO,qBAAqB,MAAM,4BAA4B,CAAC;AAC/D,OAAO,EAAE,eAAe,EAAE,MAAM,kBAAkB,CAAC;AACnD,OAAO,EAAE,UAAU,EAAE,MAAM,wBAAwB,CAAC;AACpD,OAAO,EAAE,6BAA6B,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAC;AAErF,OAAO,EAAE,aAAa,EAAE,MAAM,iCAAiC,CAAC;AAChE,OAAO,EAAE,sBAAsB,EAAE,MAAM,gBAAgB,CAAC;AAExD,MAAM,kBAAkB,GAAG,
|
|
1
|
+
{"version":3,"file":"applyTheme.js","sourceRoot":"","sources":["../../src/theming/applyTheme.ts"],"names":[],"mappings":"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","sourcesContent":["import { getThemeProperties, getRegisteredPackages, isThemeRegistered } from \"../asset-registries/Themes.js\";\nimport { removeStyle, createOrUpdateStyle } from \"../ManagedStyles.js\";\nimport getThemeDesignerTheme from \"./getThemeDesignerTheme.js\";\nimport { fireThemeLoaded } from \"./ThemeLoaded.js\";\nimport { getFeature } from \"../FeaturesRegistry.js\";\nimport { attachCustomThemeStylesToHead, getThemeRoot } from \"../config/ThemeRoot.js\";\nimport type OpenUI5Support from \"../features/OpenUI5Support.js\";\nimport { DEFAULT_THEME } from \"../generated/AssetParameters.js\";\nimport { getCurrentRuntimeIndex } from \"../Runtimes.js\";\n\n// eslint-disable-next-line\nconst BASE_THEME_PACKAGE = \"@\" + \"ui5\" + \"/\" + \"webcomponents-theming\";\n\nconst isThemeBaseRegistered = () => {\n\tconst registeredPackages = getRegisteredPackages();\n\treturn registeredPackages.has(BASE_THEME_PACKAGE);\n};\n\nconst loadThemeBase = async (theme: string) => {\n\tif (!isThemeBaseRegistered()) {\n\t\treturn;\n\t}\n\n\tconst cssData = await getThemeProperties(BASE_THEME_PACKAGE, theme);\n\tif (cssData) {\n\t\tcreateOrUpdateStyle(cssData, \"data-ui5-theme-properties\", BASE_THEME_PACKAGE, theme);\n\t}\n};\n\nconst deleteThemeBase = () => {\n\tremoveStyle(\"data-ui5-theme-properties\", BASE_THEME_PACKAGE);\n};\n\nconst loadComponentPackages = async (theme: string, externalThemeName?: string) => {\n\tconst registeredPackages = getRegisteredPackages();\n\n\tconst packagesStylesPromises = [...registeredPackages].map(async packageName => {\n\t\tif (packageName === BASE_THEME_PACKAGE) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst cssData = await getThemeProperties(packageName, theme, externalThemeName);\n\t\tif (cssData) {\n\t\t\tcreateOrUpdateStyle(cssData, `data-ui5-component-properties-${getCurrentRuntimeIndex()}`, packageName);\n\t\t}\n\t});\n\n\treturn Promise.all(packagesStylesPromises);\n};\n\nconst detectExternalTheme = async (theme: string) => {\n\t// If theme designer theme is detected, use this\n\tconst extTheme = getThemeDesignerTheme();\n\tif (extTheme) {\n\t\treturn extTheme;\n\t}\n\n\t// If OpenUI5Support is enabled, try to find out if it loaded variables\n\tconst openUI5Support = getFeature<typeof OpenUI5Support>(\"OpenUI5Support\");\n\tif (openUI5Support && openUI5Support.isOpenUI5Detected()) {\n\t\tconst varsLoaded = openUI5Support.cssVariablesLoaded();\n\t\tif (varsLoaded) {\n\t\t\treturn {\n\t\t\t\tthemeName: openUI5Support.getConfigurationSettingsObject()?.theme, // just themeName\n\t\t\t\tbaseThemeName: \"\", // baseThemeName is only relevant for custom themes\n\t\t\t};\n\t\t}\n\t} else if (getThemeRoot()) {\n\t\tawait attachCustomThemeStylesToHead(theme);\n\n\t\treturn getThemeDesignerTheme();\n\t}\n};\n\nconst applyTheme = async (theme: string) => {\n\tconst extTheme = await detectExternalTheme(theme);\n\n\t// Only load theme_base properties if there is no externally loaded theme, or there is, but it is not being loaded\n\tif (!extTheme || theme !== extTheme.themeName) {\n\t\tawait loadThemeBase(theme);\n\t} else {\n\t\tdeleteThemeBase();\n\t}\n\n\t// Always load component packages properties. For non-registered themes, try with the base theme, if any\n\tconst packagesTheme = isThemeRegistered(theme) ? theme : extTheme && extTheme.baseThemeName;\n\tawait loadComponentPackages(packagesTheme || DEFAULT_THEME, extTheme && extTheme.themeName === theme ? theme : undefined);\n\n\tfireThemeLoaded(theme);\n};\n\nexport default applyTheme;\n"]}
|
|
@@ -39,7 +39,7 @@ const findFocusableElement = async (container, forward, startFromContainer) => {
|
|
|
39
39
|
let assignedElements;
|
|
40
40
|
let currentIndex = -1;
|
|
41
41
|
if (container.shadowRoot) {
|
|
42
|
-
child = forward ? container.shadowRoot.
|
|
42
|
+
child = forward ? container.shadowRoot.firstElementChild : container.shadowRoot.lastElementChild;
|
|
43
43
|
}
|
|
44
44
|
else if (container instanceof HTMLSlotElement && container.assignedNodes()) {
|
|
45
45
|
assignedElements = container.assignedElements();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FocusableElements.js","sourceRoot":"","sources":["../../src/util/FocusableElements.ts"],"names":[],"mappings":"AAAA,OAAO,eAAe,MAAM,sBAAsB,CAAC;AACnD,OAAO,kBAAkB,MAAM,yBAAyB,CAAC;AACzD,OAAO,EAAE,oBAAoB,EAAE,MAAM,kBAAkB,CAAC;AACxD,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AAIxC,MAAM,WAAW,GAAG,CAAC,EAAe,EAAE,EAAE;IACvC,OAAO,EAAE,CAAC,YAAY,CAAC,qBAAqB,CAAC,CAAC;AAC/C,CAAC,CAAC;AAEF,MAAM,YAAY,GAAG,CAAC,EAAe,EAAE,EAAE;IACxC,MAAM,aAAa,GAAG,gBAAgB,CAAC,EAAE,CAAC,CAAC;IAE3C,OAAO,CAAC,EAAE,CAAC,YAAY,GAAG,EAAE,CAAC,YAAY,IAAI,CAAC,QAAQ,EAAE,MAAM,CAAC,CAAC,OAAO,CAAC,aAAa,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC;WAClG,CAAC,EAAE,CAAC,WAAW,GAAG,EAAE,CAAC,WAAW,IAAI,CAAC,QAAQ,EAAE,MAAM,CAAC,CAAC,OAAO,CAAC,aAAa,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC,CAAC;AACnG,CAAC,CAAC;AAEF,MAAM,wBAAwB,GAAG,KAAK,EAAE,SAAsB,EAAE,kBAA4B,EAA2B,EAAE;IACxH,IAAI,CAAC,SAAS,IAAI,eAAe,CAAC,SAAS,CAAC,EAAE,CAAC;QAC9C,OAAO,IAAI,CAAC;IACb,CAAC;IAED,OAAO,oBAAoB,CAAC,SAAS,EAAE,IAAI,EAAE,kBAAkB,CAAC,CAAC;AAClE,CAAC,CAAC;AAEF,MAAM,uBAAuB,GAAG,KAAK,EAAE,SAAsB,EAAE,kBAA4B,EAA2B,EAAE;IACvH,IAAI,CAAC,SAAS,IAAI,eAAe,CAAC,SAAS,CAAC,EAAE,CAAC;QAC9C,OAAO,IAAI,CAAC;IACb,CAAC;IAED,OAAO,oBAAoB,CAAC,SAAS,EAAE,KAAK,EAAE,kBAAkB,CAAC,CAAC;AACnE,CAAC,CAAC;AAEF,MAAM,eAAe,GAAG,CAAC,EAAe,EAAE,EAAE;IAC3C,OAAO,EAAE,CAAC,YAAY,CAAC,yBAAyB,CAAC,IAAI,CAAC,eAAe,CAAC,EAAE,CAAC,CAAC;AAC3E,CAAC,CAAC;AAEF,MAAM,gCAAgC,GAAG,CAAC,EAAe,EAAE,EAAE;IAC5D,IAAI,oBAAoB,CAAC,EAAE,CAAC,EAAE,CAAC;QAC9B,MAAM,QAAQ,GAAG,EAAE,CAAC,YAAY,CAAC,UAAU,CAAC,CAAC;QAC7C,IAAI,QAAQ,KAAK,IAAI,IAAI,QAAQ,CAAC,QAAQ,CAAC,GAAG,CAAC,EAAE,CAAC;YACjD,OAAO,IAAI,CAAC;QACb,CAAC;IACF,CAAC;IAED,OAAO,KAAK,CAAC;AACd,CAAC,CAAC;AAEF,MAAM,oBAAoB,GAAG,KAAK,EAAE,SAAsB,EAAE,OAAgB,EAAE,kBAA4B,EAA2B,EAAE;IACtI,IAAI,KAA8B,CAAC;IACnC,IAAI,gBAAgB,CAAC;IACrB,IAAI,YAAY,GAAG,CAAC,CAAC,CAAC;IAEtB,IAAI,SAAS,CAAC,UAAU,EAAE,CAAC;QAC1B,KAAK,GAAG,OAAO,CAAC,CAAC,CAAC,SAAS,CAAC,UAAU,CAAC,
|
|
1
|
+
{"version":3,"file":"FocusableElements.js","sourceRoot":"","sources":["../../src/util/FocusableElements.ts"],"names":[],"mappings":"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","sourcesContent":["import isElementHidden from \"./isElementHidden.js\";\nimport isElementClickable from \"./isElementClickable.js\";\nimport { instanceOfUI5Element } from \"../UI5Element.js\";\nimport { isSafari } from \"../Device.js\";\n\ntype FocusableElementPromise = Promise<HTMLElement | null>;\n\nconst isFocusTrap = (el: HTMLElement) => {\n\treturn el.hasAttribute(\"data-ui5-focus-trap\");\n};\n\nconst isScrollable = (el: HTMLElement) => {\n\tconst computedStyle = getComputedStyle(el);\n\n\treturn (el.scrollHeight > el.clientHeight && [\"scroll\", \"auto\"].indexOf(computedStyle.overflowY) >= 0)\n\t\t|| (el.scrollWidth > el.clientWidth && [\"scroll\", \"auto\"].indexOf(computedStyle.overflowX) >= 0);\n};\n\nconst getFirstFocusableElement = async (container: HTMLElement, startFromContainer?: boolean): FocusableElementPromise => {\n\tif (!container || isElementHidden(container)) {\n\t\treturn null;\n\t}\n\n\treturn findFocusableElement(container, true, startFromContainer);\n};\n\nconst getLastFocusableElement = async (container: HTMLElement, startFromContainer?: boolean): FocusableElementPromise => {\n\tif (!container || isElementHidden(container)) {\n\t\treturn null;\n\t}\n\n\treturn findFocusableElement(container, false, startFromContainer);\n};\n\nconst isElemFocusable = (el: HTMLElement) => {\n\treturn el.hasAttribute(\"data-ui5-focus-redirect\") || !isElementHidden(el);\n};\n\nconst isUI5ElementWithNegativeTabIndex = (el: HTMLElement) => {\n\tif (instanceOfUI5Element(el)) {\n\t\tconst tabIndex = el.getAttribute(\"tabindex\");\n\t\tif (tabIndex !== null && parseInt(tabIndex) < 0) {\n\t\t\treturn true;\n\t\t}\n\t}\n\n\treturn false;\n};\n\nconst findFocusableElement = async (container: HTMLElement, forward: boolean, startFromContainer?: boolean): FocusableElementPromise => {\n\tlet child: HTMLElement | undefined;\n\tlet assignedElements;\n\tlet currentIndex = -1;\n\n\tif (container.shadowRoot) {\n\t\tchild = forward ? container.shadowRoot.firstElementChild as HTMLElement : container.shadowRoot.lastElementChild as HTMLElement;\n\t} else if (container instanceof HTMLSlotElement && container.assignedNodes()) {\n\t\tassignedElements = container.assignedElements();\n\t\tcurrentIndex = forward ? 0 : assignedElements.length - 1;\n\t\tchild = assignedElements[currentIndex] as HTMLElement;\n\t} else if (startFromContainer) {\n\t\tchild = container;\n\t} else {\n\t\tchild = forward ? container.firstElementChild as HTMLElement : container.lastElementChild as HTMLElement;\n\t}\n\n\tlet focusableDescendant;\n\n\t/* eslint-disable no-await-in-loop */\n\n\twhile (child) {\n\t\tconst originalChild: HTMLElement | undefined = child;\n\n\t\tif (!isElementHidden(originalChild) && !isUI5ElementWithNegativeTabIndex(originalChild)) {\n\t\t\tif (instanceOfUI5Element(child)) {\n\t\t\t\t// getDomRef is used because some components mark their focusable ref in an inner\n\t\t\t\t// html but there might also be focusable targets outside of it\n\t\t\t\t// as an example - TreeItemBase\n\t\t\t\t// div - root of the component returned by getDomRef()\n\t\t\t\t// \tli.ui5-li-tree - returned by getFocusDomRef() and may not be focusable (ItemNavigation manages tabindex)\n\t\t\t\t// \tul.subtree - may still contain focusable targets (sub nodes of the tree item)\n\t\t\t\tawait child._waitForDomRef();\n\t\t\t\tchild = child.getDomRef();\n\t\t\t}\n\n\t\t\tif (!child || isElementHidden(child)) {\n\t\t\t\treturn null;\n\t\t\t}\n\n\t\t\tif (child.nodeType === 1 && isElemFocusable(child) && !isFocusTrap(child)) {\n\t\t\t\tif (isElementClickable(child)) {\n\t\t\t\t\treturn (child && typeof child.focus === \"function\") ? child : null;\n\t\t\t\t}\n\n\t\t\t\tfocusableDescendant = await findFocusableElement(child, forward);\n\n\t\t\t\t// check if it is a keyboard focusable scroll container\n\t\t\t\tif (!isSafari() && !focusableDescendant && isScrollable(child)) {\n\t\t\t\t\treturn (child && typeof child.focus === \"function\") ? child : null;\n\t\t\t\t}\n\n\t\t\t\tif (focusableDescendant) {\n\t\t\t\t\treturn (focusableDescendant && typeof focusableDescendant.focus === \"function\") ? focusableDescendant : null;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\tchild = forward ? originalChild.nextElementSibling as HTMLElement : originalChild.previousElementSibling as HTMLElement;\n\n\t\t// If the child element is not part of the currently assigned element,\n\t\t// we have to check the next/previous element assigned to the slot or continue with the next/previous sibling of the slot,\n\t\t// otherwise, the nextSibling/previousSibling is the next element inside the light DOM\n\t\tif (assignedElements && !assignedElements[currentIndex].contains(child)) {\n\t\t\tcurrentIndex = forward ? currentIndex + 1 : currentIndex - 1;\n\n\t\t\tchild = assignedElements[currentIndex] as HTMLElement;\n\t\t}\n\t}\n\n\t/* eslint-enable no-await-in-loop */\n\n\treturn null;\n};\n\nexport {\n\tgetFirstFocusableElement,\n\tgetLastFocusableElement,\n};\n"]}
|
|
@@ -1,7 +1,4 @@
|
|
|
1
|
-
import type UI5Element from "../../UI5Element.js";
|
|
2
1
|
import type MovePlacement from "../../types/MovePlacement.js";
|
|
3
|
-
declare const setDraggedElement: (element: HTMLElement | null) => void;
|
|
4
|
-
type SetDraggedElementFunction = typeof setDraggedElement;
|
|
5
2
|
/**
|
|
6
3
|
* Starts a multiple drag operation by creating a drag ghost element.
|
|
7
4
|
* The drag ghost will be displayed when dragging multiple items.
|
|
@@ -10,7 +7,7 @@ type SetDraggedElementFunction = typeof setDraggedElement;
|
|
|
10
7
|
* @param {DragEvent} e - The drag event that triggered the operation.
|
|
11
8
|
* @public
|
|
12
9
|
*/
|
|
13
|
-
declare const startMultipleDrag: (count: number, e: DragEvent) => void
|
|
10
|
+
declare const startMultipleDrag: (count: number, e: DragEvent) => Promise<void>;
|
|
14
11
|
type DragAndDropSettings = {
|
|
15
12
|
/**
|
|
16
13
|
* Allow cross-browser and file drag and drop.
|
|
@@ -32,13 +29,11 @@ type MoveEventDetail = {
|
|
|
32
29
|
};
|
|
33
30
|
};
|
|
34
31
|
declare const DragRegistry: {
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
addSelfManagedArea: (area: HTMLElement | ShadowRoot) => (element: HTMLElement | null) => void;
|
|
38
|
-
removeSelfManagedArea: (area: HTMLElement | ShadowRoot) => void;
|
|
32
|
+
setDraggedElement: (element: HTMLElement | null) => void;
|
|
33
|
+
clearDraggedElement: () => void;
|
|
39
34
|
getDraggedElement: () => HTMLElement | null;
|
|
40
|
-
startMultipleDrag: (count: number, e: DragEvent) => void
|
|
35
|
+
startMultipleDrag: (count: number, e: DragEvent) => Promise<void>;
|
|
41
36
|
};
|
|
42
37
|
export default DragRegistry;
|
|
43
38
|
export { startMultipleDrag, };
|
|
44
|
-
export type {
|
|
39
|
+
export type { DragAndDropSettings, MoveEventDetail, };
|
|
@@ -2,44 +2,13 @@ import MultipleDragGhostCss from "../../generated/css/MultipleDragGhost.css.js";
|
|
|
2
2
|
import { getI18nBundle } from "../../i18nBundle.js";
|
|
3
3
|
import { DRAG_DROP_MULTIPLE_TEXT, } from "../../generated/i18n/i18n-defaults.js";
|
|
4
4
|
const MIN_MULTI_DRAG_COUNT = 2;
|
|
5
|
-
let customDragElementPromise = null;
|
|
6
5
|
let draggedElement = null;
|
|
7
|
-
let globalHandlersAttached = false;
|
|
8
|
-
const subscribers = new Set();
|
|
9
|
-
const selfManagedDragAreas = new Set();
|
|
10
|
-
const ondragstart = (e) => {
|
|
11
|
-
if (!e.dataTransfer || !(e.target instanceof HTMLElement)) {
|
|
12
|
-
return;
|
|
13
|
-
}
|
|
14
|
-
if (!selfManagedDragAreas.has(e.target)) {
|
|
15
|
-
draggedElement = e.target;
|
|
16
|
-
}
|
|
17
|
-
handleMultipleDrag(e);
|
|
18
|
-
};
|
|
19
|
-
const handleMultipleDrag = async (e) => {
|
|
20
|
-
if (!customDragElementPromise || !e.dataTransfer) {
|
|
21
|
-
return;
|
|
22
|
-
}
|
|
23
|
-
const dragElement = await customDragElementPromise;
|
|
24
|
-
// Add to document body temporarily
|
|
25
|
-
document.body.appendChild(dragElement);
|
|
26
|
-
e.dataTransfer.setDragImage(dragElement, 0, 0);
|
|
27
|
-
// Clean up the temporary element after the drag operation starts
|
|
28
|
-
requestAnimationFrame(() => {
|
|
29
|
-
dragElement.remove();
|
|
30
|
-
});
|
|
31
|
-
};
|
|
32
|
-
const ondragend = () => {
|
|
33
|
-
draggedElement = null;
|
|
34
|
-
customDragElementPromise = null;
|
|
35
|
-
};
|
|
36
|
-
const ondrop = () => {
|
|
37
|
-
draggedElement = null;
|
|
38
|
-
customDragElementPromise = null;
|
|
39
|
-
};
|
|
40
6
|
const setDraggedElement = (element) => {
|
|
41
7
|
draggedElement = element;
|
|
42
8
|
};
|
|
9
|
+
const clearDraggedElement = () => {
|
|
10
|
+
draggedElement = null;
|
|
11
|
+
};
|
|
43
12
|
const getDraggedElement = () => {
|
|
44
13
|
return draggedElement;
|
|
45
14
|
};
|
|
@@ -61,53 +30,26 @@ const createDefaultMultiDragElement = async (count) => {
|
|
|
61
30
|
* @param {DragEvent} e - The drag event that triggered the operation.
|
|
62
31
|
* @public
|
|
63
32
|
*/
|
|
64
|
-
|
|
65
|
-
const startMultipleDrag = (count, e) => {
|
|
33
|
+
const startMultipleDrag = async (count, e) => {
|
|
66
34
|
if (count < MIN_MULTI_DRAG_COUNT) {
|
|
67
35
|
console.warn(`Cannot start multiple drag with count ${count}. Minimum is ${MIN_MULTI_DRAG_COUNT}.`); // eslint-disable-line
|
|
68
36
|
return;
|
|
69
37
|
}
|
|
70
|
-
|
|
71
|
-
};
|
|
72
|
-
const attachGlobalHandlers = () => {
|
|
73
|
-
if (globalHandlersAttached) {
|
|
38
|
+
if (!e.dataTransfer) {
|
|
74
39
|
return;
|
|
75
40
|
}
|
|
76
|
-
|
|
77
|
-
document
|
|
78
|
-
document.body.
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
document.body.removeEventListener("drop", ondrop);
|
|
85
|
-
globalHandlersAttached = false;
|
|
86
|
-
};
|
|
87
|
-
const subscribe = (subscriber) => {
|
|
88
|
-
subscribers.add(subscriber);
|
|
89
|
-
if (!globalHandlersAttached) {
|
|
90
|
-
attachGlobalHandlers();
|
|
91
|
-
}
|
|
92
|
-
};
|
|
93
|
-
const unsubscribe = (subscriber) => {
|
|
94
|
-
subscribers.delete(subscriber);
|
|
95
|
-
if (subscribers.size === 0 && globalHandlersAttached) {
|
|
96
|
-
detachGlobalHandlers();
|
|
97
|
-
}
|
|
98
|
-
};
|
|
99
|
-
const addSelfManagedArea = (area) => {
|
|
100
|
-
selfManagedDragAreas.add(area);
|
|
101
|
-
return setDraggedElement;
|
|
102
|
-
};
|
|
103
|
-
const removeSelfManagedArea = (area) => {
|
|
104
|
-
selfManagedDragAreas.delete(area);
|
|
41
|
+
const customDragElement = await createDefaultMultiDragElement(count);
|
|
42
|
+
// Add to document body temporarily
|
|
43
|
+
document.body.appendChild(customDragElement);
|
|
44
|
+
e.dataTransfer.setDragImage(customDragElement, 0, 0);
|
|
45
|
+
// Clean up the temporary element after the drag operation starts
|
|
46
|
+
requestAnimationFrame(() => {
|
|
47
|
+
customDragElement.remove();
|
|
48
|
+
});
|
|
105
49
|
};
|
|
106
50
|
const DragRegistry = {
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
addSelfManagedArea,
|
|
110
|
-
removeSelfManagedArea,
|
|
51
|
+
setDraggedElement,
|
|
52
|
+
clearDraggedElement,
|
|
111
53
|
getDraggedElement,
|
|
112
54
|
startMultipleDrag,
|
|
113
55
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DragRegistry.js","sourceRoot":"","sources":["../../../src/util/dragAndDrop/DragRegistry.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"DragRegistry.js","sourceRoot":"","sources":["../../../src/util/dragAndDrop/DragRegistry.ts"],"names":[],"mappings":"AACA,OAAO,oBAAoB,MAAM,8CAA8C,CAAC;AAEhF,OAAO,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAC;AAEpD,OAAO,EACN,uBAAuB,GACvB,MAAM,uCAAuC,CAAC;AAE/C,MAAM,oBAAoB,GAAG,CAAC,CAAC;AAE/B,IAAI,cAAc,GAAuB,IAAI,CAAC;AAE9C,MAAM,iBAAiB,GAAG,CAAC,OAA2B,EAAE,EAAE;IACzD,cAAc,GAAG,OAAO,CAAC;AAC1B,CAAC,CAAC;AAEF,MAAM,mBAAmB,GAAG,GAAG,EAAE;IAChC,cAAc,GAAG,IAAI,CAAC;AACvB,CAAC,CAAC;AAEF,MAAM,iBAAiB,GAAG,GAAG,EAAE;IAC9B,OAAO,cAAc,CAAC;AACvB,CAAC,CAAC;AAEF,MAAM,6BAA6B,GAAG,KAAK,EAAE,KAAa,EAAwB,EAAE;IACnF,MAAM,WAAW,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;IAClD,MAAM,UAAU,GAAG,MAAM,aAAa,CAAC,yBAAyB,CAAC,CAAC;IAElE,MAAM,iBAAiB,GAAG,WAAW,CAAC,YAAY,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC,CAAC;IAErE,MAAM,MAAM,GAAG,IAAI,aAAa,EAAE,CAAC;IACnC,MAAM,CAAC,WAAW,CAAC,oBAAoB,CAAC,CAAC;IAEzC,iBAAiB,CAAC,kBAAkB,GAAG,CAAC,MAAM,CAAC,CAAC;IAChD,iBAAiB,CAAC,WAAW,GAAG,UAAU,CAAC,OAAO,CAAC,uBAAuB,EAAE,KAAK,CAAC,CAAC;IAEnF,OAAO,WAAW,CAAC;AACpB,CAAC,CAAC;AAEF;;;;;;;GAOG;AACH,MAAM,iBAAiB,GAAG,KAAK,EAAE,KAAa,EAAE,CAAY,EAAE,EAAE;IAC/D,IAAI,KAAK,GAAG,oBAAoB,EAAE,CAAC;QAClC,OAAO,CAAC,IAAI,CAAC,yCAAyC,KAAK,gBAAgB,oBAAoB,GAAG,CAAC,CAAC,CAAC,sBAAsB;QAC3H,OAAO;IACR,CAAC;IAED,IAAI,CAAC,CAAC,CAAC,YAAY,EAAE,CAAC;QACrB,OAAO;IACR,CAAC;IAED,MAAM,iBAAiB,GAAG,MAAM,6BAA6B,CAAC,KAAK,CAAC,CAAC;IAErE,mCAAmC;IACnC,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,iBAAiB,CAAC,CAAC;IAE7C,CAAC,CAAC,YAAY,CAAC,YAAY,CAAC,iBAAiB,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC;IAErD,iEAAiE;IACjE,qBAAqB,CAAC,GAAG,EAAE;QAC1B,iBAAiB,CAAC,MAAM,EAAE,CAAC;IAC5B,CAAC,CAAC,CAAC;AACJ,CAAC,CAAC;AAwBF,MAAM,YAAY,GAAG;IACpB,iBAAiB;IACjB,mBAAmB;IACnB,iBAAiB;IACjB,iBAAiB;CACjB,CAAC;AAEF,eAAe,YAAY,CAAC;AAC5B,OAAO,EACN,iBAAiB,GACjB,CAAC","sourcesContent":["import type MovePlacement from \"../../types/MovePlacement.js\";\nimport MultipleDragGhostCss from \"../../generated/css/MultipleDragGhost.css.js\";\n\nimport { getI18nBundle } from \"../../i18nBundle.js\";\n\nimport {\n\tDRAG_DROP_MULTIPLE_TEXT,\n} from \"../../generated/i18n/i18n-defaults.js\";\n\nconst MIN_MULTI_DRAG_COUNT = 2;\n\nlet draggedElement: HTMLElement | null = null;\n\nconst setDraggedElement = (element: HTMLElement | null) => {\n\tdraggedElement = element;\n};\n\nconst clearDraggedElement = () => {\n\tdraggedElement = null;\n};\n\nconst getDraggedElement = () => {\n\treturn draggedElement;\n};\n\nconst createDefaultMultiDragElement = async (count: number): Promise<HTMLElement> => {\n\tconst dragElement = document.createElement(\"div\");\n\tconst i18nBundle = await getI18nBundle(\"@ui5/webcomponents-base\");\n\n\tconst dragElementShadow = dragElement.attachShadow({ mode: \"open\" });\n\n\tconst styles = new CSSStyleSheet();\n\tstyles.replaceSync(MultipleDragGhostCss);\n\n\tdragElementShadow.adoptedStyleSheets = [styles];\n\tdragElementShadow.textContent = i18nBundle.getText(DRAG_DROP_MULTIPLE_TEXT, count);\n\n\treturn dragElement;\n};\n\n/**\n * Starts a multiple drag operation by creating a drag ghost element.\n * The drag ghost will be displayed when dragging multiple items.\n *\n * @param {number} count - The number of items being dragged.\n * @param {DragEvent} e - The drag event that triggered the operation.\n * @public\n */\nconst startMultipleDrag = async (count: number, e: DragEvent) => {\n\tif (count < MIN_MULTI_DRAG_COUNT) {\n\t\tconsole.warn(`Cannot start multiple drag with count ${count}. Minimum is ${MIN_MULTI_DRAG_COUNT}.`); // eslint-disable-line\n\t\treturn;\n\t}\n\n\tif (!e.dataTransfer) {\n\t\treturn;\n\t}\n\n\tconst customDragElement = await createDefaultMultiDragElement(count);\n\n\t// Add to document body temporarily\n\tdocument.body.appendChild(customDragElement);\n\n\te.dataTransfer.setDragImage(customDragElement, 0, 0);\n\n\t// Clean up the temporary element after the drag operation starts\n\trequestAnimationFrame(() => {\n\t\tcustomDragElement.remove();\n\t});\n};\n\ntype DragAndDropSettings = {\n\t/**\n\t * Allow cross-browser and file drag and drop.\n\t */\n\tcrossDnD?: boolean;\n\t/**\n\t * Pass the original event in the event parameters.\n\t */\n\toriginalEvent?: boolean;\n};\n\ntype MoveEventDetail = {\n\toriginalEvent: Event,\n\tsource: {\n\t\telement: HTMLElement,\n\t},\n\tdestination: {\n\t\telement: HTMLElement,\n\t\tplacement: `${MovePlacement}`,\n\t}\n};\n\nconst DragRegistry = {\n\tsetDraggedElement,\n\tclearDraggedElement,\n\tgetDraggedElement,\n\tstartMultipleDrag,\n};\n\nexport default DragRegistry;\nexport {\n\tstartMultipleDrag,\n};\n\nexport type {\n\tDragAndDropSettings,\n\tMoveEventDetail,\n};\n"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@ui5/webcomponents-base",
|
|
3
|
-
"version": "2.14.0-rc.
|
|
3
|
+
"version": "2.14.0-rc.4",
|
|
4
4
|
"description": "UI5 Web Components: webcomponents.base",
|
|
5
5
|
"author": "SAP SE (https://www.sap.com)",
|
|
6
6
|
"license": "Apache-2.0",
|
|
@@ -63,7 +63,7 @@
|
|
|
63
63
|
"@openui5/sap.ui.core": "1.120.17",
|
|
64
64
|
"@sap-theming/theming-base-content": "11.29.3",
|
|
65
65
|
"@ui5/cypress-internal": "0.0.0",
|
|
66
|
-
"@ui5/webcomponents-tools": "2.14.0-rc.
|
|
66
|
+
"@ui5/webcomponents-tools": "2.14.0-rc.4",
|
|
67
67
|
"chromedriver": "^138.0.5",
|
|
68
68
|
"clean-css": "^5.2.2",
|
|
69
69
|
"copy-and-watch": "^0.1.5",
|
|
@@ -74,5 +74,5 @@
|
|
|
74
74
|
"resolve": "^1.20.0",
|
|
75
75
|
"touch": "^3.1.0"
|
|
76
76
|
},
|
|
77
|
-
"gitHead": "
|
|
77
|
+
"gitHead": "78c6d46cae8babcc0fd6194c87313da688b76ba9"
|
|
78
78
|
}
|