@ui5/webcomponents-base 2.11.0-rc.0 → 2.11.0-rc.2

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.
@@ -1,4 +1,4 @@
1
- import { render, createContext } from "../thirdparty/preact/preact.module.js";
1
+ import { hydrate, render, createContext } from "../thirdparty/preact/preact.module.js";
2
2
  import { jsx } from "../thirdparty/preact/jsxRuntime.module.js";
3
3
  const instanceToContextMap = new WeakMap();
4
4
  const jsxRenderer = (instance, container) => {
@@ -10,7 +10,17 @@ const jsxRenderer = (instance, container) => {
10
10
  instanceToContextMap.set(instance, ctx);
11
11
  }
12
12
  const templateResult = instance.render();
13
- render(jsx(ctx.Provider, { value: instance, children: templateResult }), container);
13
+ const vnode = jsx(ctx.Provider, { value: instance, children: templateResult });
14
+ if (instance.__shouldHydrate) {
15
+ // Remove all server-generated style elements for component styles
16
+ // to avoid conflicts or duplication with styles added through adopted style sheets.
17
+ instance.shadowRoot?.querySelectorAll("style").forEach(style => style.remove());
18
+ hydrate(vnode, container);
19
+ instance.__shouldHydrate = false;
20
+ }
21
+ else {
22
+ render(vnode, container);
23
+ }
14
24
  };
15
25
  export default jsxRenderer;
16
26
  //# sourceMappingURL=JsxRenderer.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"JsxRenderer.js","sourceRoot":"","sources":["../../src/renderer/JsxRenderer.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,aAAa,EAAE,MAAM,uCAAuC,CAAC;AAC9E,OAAO,EAAE,GAAG,EAAE,MAAM,2CAA2C,CAAC;AAIhE,MAAM,oBAAoB,GAAG,IAAI,OAAO,EAA4D,CAAC;AAErG,MAAM,WAAW,GAAa,CAAC,QAAoB,EAAE,SAAyC,EAAE,EAAE;IACjG,IAAI,GAAG,GAAG,oBAAoB,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC;IAC7C,IAAI,CAAC,GAAG,EAAE,CAAC;QACV,8DAA8D;QAC9D,iGAAiG;QACjG,GAAG,GAAG,aAAa,CAAC,QAAQ,CAAC,CAAC;QAC9B,oBAAoB,CAAC,GAAG,CAAC,QAAQ,EAAE,GAAG,CAAC,CAAC;IACzC,CAAC;IACD,MAAM,cAAc,GAAG,QAAQ,CAAC,MAAM,EAAE,CAAC;IACzC,MAAM,CAAC,GAAG,CAAC,GAAG,CAAC,QAAQ,EAAE,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,cAAc,EAAE,CAAC,EAAE,SAAS,CAAC,CAAC;AACrF,CAAC,CAAC;AAEF,eAAe,WAAW,CAAC","sourcesContent":["import { render, createContext } from \"../thirdparty/preact/preact.module.js\";\nimport { jsx } from \"../thirdparty/preact/jsxRuntime.module.js\";\nimport type UI5Element from \"../UI5Element.js\";\nimport type { Renderer } from \"../UI5Element.js\";\n\nconst instanceToContextMap = new WeakMap<UI5Element, ReturnType<typeof createContext<UI5Element>>>();\n\nconst jsxRenderer: Renderer = (instance: UI5Element, container: HTMLElement | DocumentFragment) => {\n\tlet ctx = instanceToContextMap.get(instance);\n\tif (!ctx) {\n\t\t// create a context holding the element that is being rendered\n\t\t// this contect will be used when adding event listeners - they all will be bound to this element\n\t\tctx = createContext(instance);\n\t\tinstanceToContextMap.set(instance, ctx);\n\t}\n\tconst templateResult = instance.render();\n\trender(jsx(ctx.Provider, { value: instance, children: templateResult }), container);\n};\n\nexport default jsxRenderer;\n"]}
1
+ {"version":3,"file":"JsxRenderer.js","sourceRoot":"","sources":["../../src/renderer/JsxRenderer.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,EAAE,aAAa,EAAE,MAAM,uCAAuC,CAAC;AACvF,OAAO,EAAE,GAAG,EAAE,MAAM,2CAA2C,CAAC;AAIhE,MAAM,oBAAoB,GAAG,IAAI,OAAO,EAA4D,CAAC;AAErG,MAAM,WAAW,GAAa,CAAC,QAAoB,EAAE,SAAyC,EAAE,EAAE;IACjG,IAAI,GAAG,GAAG,oBAAoB,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC;IAC7C,IAAI,CAAC,GAAG,EAAE,CAAC;QACV,8DAA8D;QAC9D,iGAAiG;QACjG,GAAG,GAAG,aAAa,CAAC,QAAQ,CAAC,CAAC;QAC9B,oBAAoB,CAAC,GAAG,CAAC,QAAQ,EAAE,GAAG,CAAC,CAAC;IACzC,CAAC;IAED,MAAM,cAAc,GAAG,QAAQ,CAAC,MAAM,EAAE,CAAC;IACzC,MAAM,KAAK,GAAG,GAAG,CAAC,GAAG,CAAC,QAAQ,EAAE,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,cAAc,EAAE,CAAC,CAAC;IAE/E,IAAI,QAAQ,CAAC,eAAe,EAAE,CAAC;QAC9B,kEAAkE;QAClE,oFAAoF;QACpF,QAAQ,CAAC,UAAU,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,MAAM,EAAE,CAAC,CAAC;QAChF,OAAO,CAAC,KAAK,EAAE,SAAS,CAAC,CAAC;QAC1B,QAAQ,CAAC,eAAe,GAAG,KAAK,CAAC;IAClC,CAAC;SAAM,CAAC;QACP,MAAM,CAAC,KAAK,EAAE,SAAS,CAAC,CAAC;IAC1B,CAAC;AACF,CAAC,CAAC;AAEF,eAAe,WAAW,CAAC","sourcesContent":["import { hydrate, render, createContext } from \"../thirdparty/preact/preact.module.js\";\nimport { jsx } from \"../thirdparty/preact/jsxRuntime.module.js\";\nimport type UI5Element from \"../UI5Element.js\";\nimport type { Renderer } from \"../UI5Element.js\";\n\nconst instanceToContextMap = new WeakMap<UI5Element, ReturnType<typeof createContext<UI5Element>>>();\n\nconst jsxRenderer: Renderer = (instance: UI5Element, container: HTMLElement | DocumentFragment) => {\n\tlet ctx = instanceToContextMap.get(instance);\n\tif (!ctx) {\n\t\t// create a context holding the element that is being rendered\n\t\t// this contect will be used when adding event listeners - they all will be bound to this element\n\t\tctx = createContext(instance);\n\t\tinstanceToContextMap.set(instance, ctx);\n\t}\n\n\tconst templateResult = instance.render();\n\tconst vnode = jsx(ctx.Provider, { value: instance, children: templateResult });\n\n\tif (instance.__shouldHydrate) {\n\t\t// Remove all server-generated style elements for component styles\n\t\t// to avoid conflicts or duplication with styles added through adopted style sheets.\n\t\tinstance.shadowRoot?.querySelectorAll(\"style\").forEach(style => style.remove());\n\t\thydrate(vnode, container);\n\t\tinstance.__shouldHydrate = false;\n\t} else {\n\t\trender(vnode, container);\n\t}\n};\n\nexport default jsxRenderer;\n"]}
@@ -20,6 +20,7 @@ declare const getClassCopy: (klass: typeof UI5Element, constructorCallback: () =
20
20
  _deferredResolve?: import("../types.js").PromiseResolve;
21
21
  };
22
22
  _doNotSyncAttributes: Set<string>;
23
+ __shouldHydrate: boolean;
23
24
  _state: import("../UI5ElementMetadata.js").State;
24
25
  _internals: ElementInternals;
25
26
  _individualSlot?: string;
@@ -1,2 +1,2 @@
1
- declare const getEffectiveScrollbarStyle: () => "" | "::-webkit-scrollbar:horizontal {\n\theight: var(--sapScrollBar_Dimension);\n}\n\n::-webkit-scrollbar:vertical {\n\twidth: var(--sapScrollBar_Dimension);\n}\n\n::-webkit-scrollbar {\n\tbackground-color: var(--sapScrollBar_TrackColor);\n\tborder-left: none;\n}\n\n::-webkit-scrollbar-thumb {\n\tborder-radius: var(--sapElement_BorderCornerRadius);\n\tbackground-color: var(--sapScrollBar_FaceColor);\n}\n\n::-webkit-scrollbar-thumb:hover {\n\tbackground-color: var(--sapScrollBar_Hover_FaceColor);\n}\n\n::-webkit-scrollbar-corner {\n\tbackground-color: var(--sapScrollBar_TrackColor);\n}";
1
+ declare const getEffectiveScrollbarStyle: () => "" | "\n::-webkit-scrollbar:horizontal {\n\theight: var(--sapScrollBar_Dimension);\n}\n\n::-webkit-scrollbar:vertical {\n\twidth: var(--sapScrollBar_Dimension);\n}\n\n::-webkit-scrollbar {\n\tbackground-color: var(--sapScrollBar_TrackColor);\n\tborder-left: none;\n}\n\n::-webkit-scrollbar-thumb {\n\tborder-radius: var(--sapElement_BorderCornerRadius);\n\tbackground-color: var(--sapScrollBar_FaceColor);\n\tborder: 0.125rem solid var(--sapScrollBar_TrackColor);\n}\n\n::-webkit-scrollbar-thumb:hover {\n\tbackground-color: var(--sapScrollBar_Hover_FaceColor);\n}\n\n::-webkit-scrollbar-corner {\n\tbackground-color: var(--sapScrollBar_TrackColor);\n}";
2
2
  export default getEffectiveScrollbarStyle;
@@ -4,7 +4,8 @@ const getEffectiveScrollbarStyle = () => {
4
4
  if (isSSR || document.body.classList.contains(NO_SCROLLBAR_STYLE_CLASS)) {
5
5
  return "";
6
6
  }
7
- return `::-webkit-scrollbar:horizontal {
7
+ return `
8
+ ::-webkit-scrollbar:horizontal {
8
9
  height: var(--sapScrollBar_Dimension);
9
10
  }
10
11
 
@@ -20,6 +21,7 @@ const getEffectiveScrollbarStyle = () => {
20
21
  ::-webkit-scrollbar-thumb {
21
22
  border-radius: var(--sapElement_BorderCornerRadius);
22
23
  background-color: var(--sapScrollBar_FaceColor);
24
+ border: 0.125rem solid var(--sapScrollBar_TrackColor);
23
25
  }
24
26
 
25
27
  ::-webkit-scrollbar-thumb:hover {
@@ -1 +1 @@
1
- {"version":3,"file":"getEffectiveScrollbarStyle.js","sourceRoot":"","sources":["../../src/util/getEffectiveScrollbarStyle.ts"],"names":[],"mappings":"AAAA,MAAM,wBAAwB,GAAG,+BAA+B,CAAC;AACjE,MAAM,KAAK,GAAG,OAAO,QAAQ,KAAK,WAAW,CAAC;AAE9C,MAAM,0BAA0B,GAAG,GAAG,EAAE;IACvC,IAAI,KAAK,IAAI,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,wBAAwB,CAAC,EAAE,CAAC;QACzE,OAAO,EAAE,CAAC;IACX,CAAC;IAED,OAAO;;;;;;;;;;;;;;;;;;;;;;;;EAwBN,CAAC;AACH,CAAC,CAAC;AAEF,eAAe,0BAA0B,CAAC","sourcesContent":["const NO_SCROLLBAR_STYLE_CLASS = \"ui5-content-native-scrollbars\";\nconst isSSR = typeof document === \"undefined\";\n\nconst getEffectiveScrollbarStyle = () => {\n\tif (isSSR || document.body.classList.contains(NO_SCROLLBAR_STYLE_CLASS)) {\n\t\treturn \"\";\n\t}\n\n\treturn `::-webkit-scrollbar:horizontal {\n\theight: var(--sapScrollBar_Dimension);\n}\n\n::-webkit-scrollbar:vertical {\n\twidth: var(--sapScrollBar_Dimension);\n}\n\n::-webkit-scrollbar {\n\tbackground-color: var(--sapScrollBar_TrackColor);\n\tborder-left: none;\n}\n\n::-webkit-scrollbar-thumb {\n\tborder-radius: var(--sapElement_BorderCornerRadius);\n\tbackground-color: var(--sapScrollBar_FaceColor);\n}\n\n::-webkit-scrollbar-thumb:hover {\n\tbackground-color: var(--sapScrollBar_Hover_FaceColor);\n}\n\n::-webkit-scrollbar-corner {\n\tbackground-color: var(--sapScrollBar_TrackColor);\n}`;\n};\n\nexport default getEffectiveScrollbarStyle;\n"]}
1
+ {"version":3,"file":"getEffectiveScrollbarStyle.js","sourceRoot":"","sources":["../../src/util/getEffectiveScrollbarStyle.ts"],"names":[],"mappings":"AAAA,MAAM,wBAAwB,GAAG,+BAA+B,CAAC;AACjE,MAAM,KAAK,GAAG,OAAO,QAAQ,KAAK,WAAW,CAAC;AAE9C,MAAM,0BAA0B,GAAG,GAAG,EAAE;IACvC,IAAI,KAAK,IAAI,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,wBAAwB,CAAC,EAAE,CAAC;QACzE,OAAO,EAAE,CAAC;IACX,CAAC;IAED,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;EA0BN,CAAC;AACH,CAAC,CAAC;AAEF,eAAe,0BAA0B,CAAC","sourcesContent":["const NO_SCROLLBAR_STYLE_CLASS = \"ui5-content-native-scrollbars\";\nconst isSSR = typeof document === \"undefined\";\n\nconst getEffectiveScrollbarStyle = () => {\n\tif (isSSR || document.body.classList.contains(NO_SCROLLBAR_STYLE_CLASS)) {\n\t\treturn \"\";\n\t}\n\n\treturn `\n::-webkit-scrollbar:horizontal {\n\theight: var(--sapScrollBar_Dimension);\n}\n\n::-webkit-scrollbar:vertical {\n\twidth: var(--sapScrollBar_Dimension);\n}\n\n::-webkit-scrollbar {\n\tbackground-color: var(--sapScrollBar_TrackColor);\n\tborder-left: none;\n}\n\n::-webkit-scrollbar-thumb {\n\tborder-radius: var(--sapElement_BorderCornerRadius);\n\tbackground-color: var(--sapScrollBar_FaceColor);\n\tborder: 0.125rem solid var(--sapScrollBar_TrackColor);\n}\n\n::-webkit-scrollbar-thumb:hover {\n\tbackground-color: var(--sapScrollBar_Hover_FaceColor);\n}\n\n::-webkit-scrollbar-corner {\n\tbackground-color: var(--sapScrollBar_TrackColor);\n}`;\n};\n\nexport default getEffectiveScrollbarStyle;\n"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ui5/webcomponents-base",
3
- "version": "2.11.0-rc.0",
3
+ "version": "2.11.0-rc.2",
4
4
  "description": "UI5 Web Components: webcomponents.base",
5
5
  "author": "SAP SE (https://www.sap.com)",
6
6
  "license": "Apache-2.0",
@@ -62,7 +62,7 @@
62
62
  "devDependencies": {
63
63
  "@openui5/sap.ui.core": "1.120.17",
64
64
  "@ui5/cypress-internal": "0.0.0",
65
- "@ui5/webcomponents-tools": "2.11.0-rc.0",
65
+ "@ui5/webcomponents-tools": "2.11.0-rc.2",
66
66
  "chromedriver": "^135.0.0",
67
67
  "clean-css": "^5.2.2",
68
68
  "copy-and-watch": "^0.1.5",
@@ -73,5 +73,5 @@
73
73
  "resolve": "^1.20.0",
74
74
  "touch": "^3.1.0"
75
75
  },
76
- "gitHead": "50d09270861a0c765d44d4c4d4a3f25fc8daa768"
76
+ "gitHead": "ee469c159184053263f933da57457025a8ac7ddb"
77
77
  }