@yoobic/yobi 8.3.1-14 → 8.3.1-15

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.
Files changed (13) hide show
  1. package/dist/cjs/yoo-form-creator-live-preview.cjs.entry.js +1 -1
  2. package/dist/cjs/yoo-form-creator-overlay.cjs.entry.js +1 -1
  3. package/dist/cjs/yoo-header.cjs.entry.js +1 -1
  4. package/dist/collection/components/3.organisms/header/header.css +2 -1
  5. package/dist/collection/components/form-creator/form-creator-live-preview/form-creator-live-preview.js +1 -1
  6. package/dist/collection/components/form-creator/form-creator-overlay/form-creator-overlay.css +4 -1
  7. package/dist/design-system/yoo-form-creator-live-preview.entry.js +1 -1
  8. package/dist/design-system/yoo-form-creator-overlay.entry.js +1 -1
  9. package/dist/design-system/yoo-header.entry.js +1 -1
  10. package/dist/esm/yoo-form-creator-live-preview.entry.js +1 -1
  11. package/dist/esm/yoo-form-creator-overlay.entry.js +1 -1
  12. package/dist/esm/yoo-header.entry.js +1 -1
  13. package/package.json +1 -1
package/dist/cjs/yoo-form-creator-live-preview.cjs.entry.js CHANGED
@@ -58,7 +58,7 @@ const YooFormCreatorLivePreviewComponent = class {
58
58
  renderHeader() {
59
59
  var _a;
60
60
  return [
61
- index.h("yoo-header", null, index.h("yoo-navbar", { class: { 'no-heading': this.hideHeading } }, index.h("div", { class: { 'outer-container': true, 'not-closable': !this.closable } }, !this.hideHeading && index.h("div", { class: "heading" }, this.mode === 'fullscreen' && this.renderFullscreenHeader(), this.mode === 'panel' && this.renderPanelHeader()), ((_a = this.availableLanguages) === null || _a === void 0 ? void 0 : _a.length) > 0 && !this.hidden && this.renderLanguageSelector(), this.showDevices && this.renderSubheader())))
61
+ index.h("yoo-header", { style: { '--z-index': 'unset' } }, index.h("yoo-navbar", { class: { 'no-heading': this.hideHeading } }, index.h("div", { class: { 'outer-container': true, 'not-closable': !this.closable } }, !this.hideHeading && index.h("div", { class: "heading" }, this.mode === 'fullscreen' && this.renderFullscreenHeader(), this.mode === 'panel' && this.renderPanelHeader()), ((_a = this.availableLanguages) === null || _a === void 0 ? void 0 : _a.length) > 0 && !this.hidden && this.renderLanguageSelector(), this.showDevices && this.renderSubheader())))
62
62
  ];
63
63
  }
64
64
  renderFullscreenHeader() {
package/dist/cjs/yoo-form-creator-overlay.cjs.entry.js CHANGED
@@ -9,7 +9,7 @@ require('./lodash-72d493b9.js');
9
9
  require('./index-50ff0b20.js');
10
10
  require('./_commonjsHelpers-94df2ea7.js');
11
11
 
12
- const formCreatorOverlayCss = ":host .overlay{position:absolute;top:3.0625rem;right:0;bottom:0;left:25.1875rem;z-index:2;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:start;align-items:flex-start;-ms-flex-pack:center;justify-content:center}:host .overlay .overlay-background{z-index:-1;background:var(--dark, #000000);opacity:0.8;position:absolute;top:0;right:0;bottom:0;left:0}:host .overlay.only-live-preview{left:auto;width:29rem}:host .overlay.only-live-preview.live-preview-hidden{width:3rem}:host .overlay.left-panel-only{left:0;width:25rem}:host .overlay .overlay-title{display:-ms-flexbox;display:flex;margin-bottom:var(--spacing-24, 1.5rem);margin-left:var(--spacing-80, 5rem);color:var(--light, #ffffff);font-size:var(--font-size-18, 1.125rem)}:host .overlay .overlay-title yoo-icon{margin-right:var(--spacing-08, 0.5rem)}:host .overlay .overlay-title.sub{margin-bottom:var(--spacing-16, 1rem);font-weight:var(--font-weight-300, 300)}:host .overlay yoo-form-creator-block-simple{margin-left:var(--spacing-80, 5rem)}:host .header-overlay{position:absolute;top:0;right:0;bottom:auto;left:0;height:3.0625rem;background:var(--dark, #000000);opacity:0.8}";
12
+ const formCreatorOverlayCss = ":host .overlay{position:absolute;top:3.0625rem;right:0;bottom:0;left:25.1875rem;z-index:2;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:start;align-items:flex-start;-ms-flex-pack:center;justify-content:center}:host .overlay .overlay-background{z-index:-1;margin-top:-1px;margin-left:-2px;background:var(--dark, #000000);opacity:0.8;position:absolute;top:0;right:0;bottom:0;left:0}:host .overlay.only-live-preview{left:auto;width:29rem}:host .overlay.only-live-preview.live-preview-hidden{width:3rem}:host .overlay.left-panel-only{left:0;width:25rem}:host .overlay .overlay-title{display:-ms-flexbox;display:flex;margin-bottom:var(--spacing-24, 1.5rem);margin-left:var(--spacing-80, 5rem);color:var(--light, #ffffff);font-size:var(--font-size-18, 1.125rem)}:host .overlay .overlay-title yoo-icon{margin-right:var(--spacing-08, 0.5rem)}:host .overlay .overlay-title.sub{margin-bottom:var(--spacing-16, 1rem);font-weight:var(--font-weight-300, 300)}:host .overlay yoo-form-creator-block-simple{margin-left:var(--spacing-80, 5rem)}:host .header-overlay{position:absolute;top:0;right:0;bottom:auto;left:0;height:3rem;margin-left:25.05rem;background:var(--dark, #000000);opacity:0.8}";
13
13
 
14
14
  const YooFormCreatorOverlayComponent = class {
15
15
  constructor(hostRef) {
package/dist/cjs/yoo-header.cjs.entry.js CHANGED
@@ -10,7 +10,7 @@ require('./lodash-72d493b9.js');
10
10
  require('./index-50ff0b20.js');
11
11
  require('./_commonjsHelpers-94df2ea7.js');
12
12
 
13
- const headerCss = "yoo-header{position:relative;z-index:11 !important;display:block;-ms-flex-order:-1;order:-1;width:100%;background:var(--light, #ffffff);-webkit-transition:0.3s;transition:0.3s}yoo-header.transparent{background:transparent}yoo-header.secondary{z-index:unset !important}yoo-header.device-min-height{min-height:4rem}yoo-header.rounded{border-top-left-radius:0.375rem;border-top-right-radius:0.375rem}yoo-header.absolute{position:absolute}";
13
+ const headerCss = "yoo-header{--z-index:var(--z-index-11, 11);position:relative;z-index:var(--z-index) !important;display:block;-ms-flex-order:-1;order:-1;width:100%;background:var(--light, #ffffff);-webkit-transition:0.3s;transition:0.3s}yoo-header.transparent{background:transparent}yoo-header.secondary{z-index:unset !important}yoo-header.device-min-height{min-height:4rem}yoo-header.rounded{border-top-left-radius:0.375rem;border-top-right-radius:0.375rem}yoo-header.absolute{position:absolute}";
14
14
 
15
15
  const YooHeaderComponent = class {
16
16
  constructor(hostRef) {
package/dist/collection/components/3.organisms/header/header.css CHANGED
@@ -202,8 +202,9 @@ null: CSS defaults to use the ltr css, and adds [dir=rtl] selectors to override
202
202
  /* spacing for padding, margin, etc... */
203
203
  /* shadow */
204
204
  yoo-header {
205
+ --z-index: var(--z-index-11, 11);
205
206
  position: relative;
206
- z-index: 11 !important;
207
+ z-index: var(--z-index) !important;
207
208
  display: block;
208
209
  order: -1;
209
210
  width: 100%;
package/dist/collection/components/form-creator/form-creator-live-preview/form-creator-live-preview.js CHANGED
@@ -41,7 +41,7 @@ export class YooFormCreatorLivePreviewComponent {
41
41
  renderHeader() {
42
42
  var _a;
43
43
  return [
44
- h("yoo-header", null,
44
+ h("yoo-header", { style: { '--z-index': 'unset' } },
45
45
  h("yoo-navbar", { class: { 'no-heading': this.hideHeading } },
46
46
  h("div", { class: { 'outer-container': true, 'not-closable': !this.closable } },
47
47
  !this.hideHeading && h("div", { class: "heading" },
package/dist/collection/components/form-creator/form-creator-overlay/form-creator-overlay.css CHANGED
@@ -215,6 +215,8 @@ null: CSS defaults to use the ltr css, and adds [dir=rtl] selectors to override
215
215
  }
216
216
  :host .overlay .overlay-background {
217
217
  z-index: -1;
218
+ margin-top: -1px;
219
+ margin-left: -2px;
218
220
  background: var(--dark, #000000);
219
221
  opacity: 0.8;
220
222
  position: absolute;
@@ -257,7 +259,8 @@ null: CSS defaults to use the ltr css, and adds [dir=rtl] selectors to override
257
259
  right: 0;
258
260
  bottom: auto;
259
261
  left: 0;
260
- height: 3.0625rem;
262
+ height: 3rem;
263
+ margin-left: 25.05rem;
261
264
  background: var(--dark, #000000);
262
265
  opacity: 0.8;
263
266
  }
package/dist/design-system/yoo-form-creator-live-preview.entry.js CHANGED
@@ -54,7 +54,7 @@ const YooFormCreatorLivePreviewComponent = class {
54
54
  renderHeader() {
55
55
  var _a;
56
56
  return [
57
- h("yoo-header", null, h("yoo-navbar", { class: { 'no-heading': this.hideHeading } }, h("div", { class: { 'outer-container': true, 'not-closable': !this.closable } }, !this.hideHeading && h("div", { class: "heading" }, this.mode === 'fullscreen' && this.renderFullscreenHeader(), this.mode === 'panel' && this.renderPanelHeader()), ((_a = this.availableLanguages) === null || _a === void 0 ? void 0 : _a.length) > 0 && !this.hidden && this.renderLanguageSelector(), this.showDevices && this.renderSubheader())))
57
+ h("yoo-header", { style: { '--z-index': 'unset' } }, h("yoo-navbar", { class: { 'no-heading': this.hideHeading } }, h("div", { class: { 'outer-container': true, 'not-closable': !this.closable } }, !this.hideHeading && h("div", { class: "heading" }, this.mode === 'fullscreen' && this.renderFullscreenHeader(), this.mode === 'panel' && this.renderPanelHeader()), ((_a = this.availableLanguages) === null || _a === void 0 ? void 0 : _a.length) > 0 && !this.hidden && this.renderLanguageSelector(), this.showDevices && this.renderSubheader())))
58
58
  ];
59
59
  }
60
60
  renderFullscreenHeader() {
package/dist/design-system/yoo-form-creator-overlay.entry.js CHANGED
@@ -5,7 +5,7 @@ import './lodash-f6e59a8e.js';
5
5
  import './index-eec8505b.js';
6
6
  import './_commonjsHelpers-f4d11124.js';
7
7
 
8
- const formCreatorOverlayCss = ":host .overlay{position:absolute;top:3.0625rem;right:0;bottom:0;left:25.1875rem;z-index:2;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:start;align-items:flex-start;-ms-flex-pack:center;justify-content:center}:host .overlay .overlay-background{z-index:-1;background:var(--dark, #000000);opacity:0.8;position:absolute;top:0;right:0;bottom:0;left:0}:host .overlay.only-live-preview{left:auto;width:29rem}:host .overlay.only-live-preview.live-preview-hidden{width:3rem}:host .overlay.left-panel-only{left:0;width:25rem}:host .overlay .overlay-title{display:-ms-flexbox;display:flex;margin-bottom:var(--spacing-24, 1.5rem);margin-left:var(--spacing-80, 5rem);color:var(--light, #ffffff);font-size:var(--font-size-18, 1.125rem)}:host .overlay .overlay-title yoo-icon{margin-right:var(--spacing-08, 0.5rem)}:host .overlay .overlay-title.sub{margin-bottom:var(--spacing-16, 1rem);font-weight:var(--font-weight-300, 300)}:host .overlay yoo-form-creator-block-simple{margin-left:var(--spacing-80, 5rem)}:host .header-overlay{position:absolute;top:0;right:0;bottom:auto;left:0;height:3.0625rem;background:var(--dark, #000000);opacity:0.8}";
8
+ const formCreatorOverlayCss = ":host .overlay{position:absolute;top:3.0625rem;right:0;bottom:0;left:25.1875rem;z-index:2;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:start;align-items:flex-start;-ms-flex-pack:center;justify-content:center}:host .overlay .overlay-background{z-index:-1;margin-top:-1px;margin-left:-2px;background:var(--dark, #000000);opacity:0.8;position:absolute;top:0;right:0;bottom:0;left:0}:host .overlay.only-live-preview{left:auto;width:29rem}:host .overlay.only-live-preview.live-preview-hidden{width:3rem}:host .overlay.left-panel-only{left:0;width:25rem}:host .overlay .overlay-title{display:-ms-flexbox;display:flex;margin-bottom:var(--spacing-24, 1.5rem);margin-left:var(--spacing-80, 5rem);color:var(--light, #ffffff);font-size:var(--font-size-18, 1.125rem)}:host .overlay .overlay-title yoo-icon{margin-right:var(--spacing-08, 0.5rem)}:host .overlay .overlay-title.sub{margin-bottom:var(--spacing-16, 1rem);font-weight:var(--font-weight-300, 300)}:host .overlay yoo-form-creator-block-simple{margin-left:var(--spacing-80, 5rem)}:host .header-overlay{position:absolute;top:0;right:0;bottom:auto;left:0;height:3rem;margin-left:25.05rem;background:var(--dark, #000000);opacity:0.8}";
9
9
 
10
10
  const YooFormCreatorOverlayComponent = class {
11
11
  constructor(hostRef) {
package/dist/design-system/yoo-header.entry.js CHANGED
@@ -6,7 +6,7 @@ import './lodash-f6e59a8e.js';
6
6
  import './index-eec8505b.js';
7
7
  import './_commonjsHelpers-f4d11124.js';
8
8
 
9
- const headerCss = "yoo-header{position:relative;z-index:11 !important;display:block;-ms-flex-order:-1;order:-1;width:100%;background:var(--light, #ffffff);-webkit-transition:0.3s;transition:0.3s}yoo-header.transparent{background:transparent}yoo-header.secondary{z-index:unset !important}yoo-header.device-min-height{min-height:4rem}yoo-header.rounded{border-top-left-radius:0.375rem;border-top-right-radius:0.375rem}yoo-header.absolute{position:absolute}";
9
+ const headerCss = "yoo-header{--z-index:var(--z-index-11, 11);position:relative;z-index:var(--z-index) !important;display:block;-ms-flex-order:-1;order:-1;width:100%;background:var(--light, #ffffff);-webkit-transition:0.3s;transition:0.3s}yoo-header.transparent{background:transparent}yoo-header.secondary{z-index:unset !important}yoo-header.device-min-height{min-height:4rem}yoo-header.rounded{border-top-left-radius:0.375rem;border-top-right-radius:0.375rem}yoo-header.absolute{position:absolute}";
10
10
 
11
11
  const YooHeaderComponent = class {
12
12
  constructor(hostRef) {
package/dist/esm/yoo-form-creator-live-preview.entry.js CHANGED
@@ -54,7 +54,7 @@ const YooFormCreatorLivePreviewComponent = class {
54
54
  renderHeader() {
55
55
  var _a;
56
56
  return [
57
- h("yoo-header", null, h("yoo-navbar", { class: { 'no-heading': this.hideHeading } }, h("div", { class: { 'outer-container': true, 'not-closable': !this.closable } }, !this.hideHeading && h("div", { class: "heading" }, this.mode === 'fullscreen' && this.renderFullscreenHeader(), this.mode === 'panel' && this.renderPanelHeader()), ((_a = this.availableLanguages) === null || _a === void 0 ? void 0 : _a.length) > 0 && !this.hidden && this.renderLanguageSelector(), this.showDevices && this.renderSubheader())))
57
+ h("yoo-header", { style: { '--z-index': 'unset' } }, h("yoo-navbar", { class: { 'no-heading': this.hideHeading } }, h("div", { class: { 'outer-container': true, 'not-closable': !this.closable } }, !this.hideHeading && h("div", { class: "heading" }, this.mode === 'fullscreen' && this.renderFullscreenHeader(), this.mode === 'panel' && this.renderPanelHeader()), ((_a = this.availableLanguages) === null || _a === void 0 ? void 0 : _a.length) > 0 && !this.hidden && this.renderLanguageSelector(), this.showDevices && this.renderSubheader())))
58
58
  ];
59
59
  }
60
60
  renderFullscreenHeader() {
package/dist/esm/yoo-form-creator-overlay.entry.js CHANGED
@@ -5,7 +5,7 @@ import './lodash-f6e59a8e.js';
5
5
  import './index-eec8505b.js';
6
6
  import './_commonjsHelpers-f4d11124.js';
7
7
 
8
- const formCreatorOverlayCss = ":host .overlay{position:absolute;top:3.0625rem;right:0;bottom:0;left:25.1875rem;z-index:2;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:start;align-items:flex-start;-ms-flex-pack:center;justify-content:center}:host .overlay .overlay-background{z-index:-1;background:var(--dark, #000000);opacity:0.8;position:absolute;top:0;right:0;bottom:0;left:0}:host .overlay.only-live-preview{left:auto;width:29rem}:host .overlay.only-live-preview.live-preview-hidden{width:3rem}:host .overlay.left-panel-only{left:0;width:25rem}:host .overlay .overlay-title{display:-ms-flexbox;display:flex;margin-bottom:var(--spacing-24, 1.5rem);margin-left:var(--spacing-80, 5rem);color:var(--light, #ffffff);font-size:var(--font-size-18, 1.125rem)}:host .overlay .overlay-title yoo-icon{margin-right:var(--spacing-08, 0.5rem)}:host .overlay .overlay-title.sub{margin-bottom:var(--spacing-16, 1rem);font-weight:var(--font-weight-300, 300)}:host .overlay yoo-form-creator-block-simple{margin-left:var(--spacing-80, 5rem)}:host .header-overlay{position:absolute;top:0;right:0;bottom:auto;left:0;height:3.0625rem;background:var(--dark, #000000);opacity:0.8}";
8
+ const formCreatorOverlayCss = ":host .overlay{position:absolute;top:3.0625rem;right:0;bottom:0;left:25.1875rem;z-index:2;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:start;align-items:flex-start;-ms-flex-pack:center;justify-content:center}:host .overlay .overlay-background{z-index:-1;margin-top:-1px;margin-left:-2px;background:var(--dark, #000000);opacity:0.8;position:absolute;top:0;right:0;bottom:0;left:0}:host .overlay.only-live-preview{left:auto;width:29rem}:host .overlay.only-live-preview.live-preview-hidden{width:3rem}:host .overlay.left-panel-only{left:0;width:25rem}:host .overlay .overlay-title{display:-ms-flexbox;display:flex;margin-bottom:var(--spacing-24, 1.5rem);margin-left:var(--spacing-80, 5rem);color:var(--light, #ffffff);font-size:var(--font-size-18, 1.125rem)}:host .overlay .overlay-title yoo-icon{margin-right:var(--spacing-08, 0.5rem)}:host .overlay .overlay-title.sub{margin-bottom:var(--spacing-16, 1rem);font-weight:var(--font-weight-300, 300)}:host .overlay yoo-form-creator-block-simple{margin-left:var(--spacing-80, 5rem)}:host .header-overlay{position:absolute;top:0;right:0;bottom:auto;left:0;height:3rem;margin-left:25.05rem;background:var(--dark, #000000);opacity:0.8}";
9
9
 
10
10
  const YooFormCreatorOverlayComponent = class {
11
11
  constructor(hostRef) {
package/dist/esm/yoo-header.entry.js CHANGED
@@ -6,7 +6,7 @@ import './lodash-f6e59a8e.js';
6
6
  import './index-eec8505b.js';
7
7
  import './_commonjsHelpers-f4d11124.js';
8
8
 
9
- const headerCss = "yoo-header{position:relative;z-index:11 !important;display:block;-ms-flex-order:-1;order:-1;width:100%;background:var(--light, #ffffff);-webkit-transition:0.3s;transition:0.3s}yoo-header.transparent{background:transparent}yoo-header.secondary{z-index:unset !important}yoo-header.device-min-height{min-height:4rem}yoo-header.rounded{border-top-left-radius:0.375rem;border-top-right-radius:0.375rem}yoo-header.absolute{position:absolute}";
9
+ const headerCss = "yoo-header{--z-index:var(--z-index-11, 11);position:relative;z-index:var(--z-index) !important;display:block;-ms-flex-order:-1;order:-1;width:100%;background:var(--light, #ffffff);-webkit-transition:0.3s;transition:0.3s}yoo-header.transparent{background:transparent}yoo-header.secondary{z-index:unset !important}yoo-header.device-min-height{min-height:4rem}yoo-header.rounded{border-top-left-radius:0.375rem;border-top-right-radius:0.375rem}yoo-header.absolute{position:absolute}";
10
10
 
11
11
  const YooHeaderComponent = class {
12
12
  constructor(hostRef) {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@yoobic/yobi",
3
- "version": "8.3.1-14",
3
+ "version": "8.3.1-15",
4
4
  "description": "Yobi - Yoobic Design System",
5
5
  "module": "dist/index.js",
6
6
  "main": "dist/index.cjs.js",