@builder.io/sdk-svelte 0.0.1-28 → 0.0.1-30

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 (4) hide show
  1. package/package.json +1 -1
  2. package/src/blocks/button/button.svelte +9 -1
  3. package/src/blocks/columns/columns.svelte +8 -3
  4. package/src/components/render-content/render-content.svelte +11 -4
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@builder.io/sdk-svelte",
3
3
  "description": "Builder.io SDK for Svelte",
4
- "version": "0.0.1-28",
4
+ "version": "0.0.1-30",
5
5
  "type": "module",
6
6
  "files": [
7
7
  "src"
package/src/blocks/button/button.svelte CHANGED
@@ -15,5 +15,13 @@
15
15
  {text}
16
16
  </a>
17
17
  {:else}
18
- <span {...attributes}>{text}</span>
18
+ <button {...attributes} class="button">
19
+ {text}
20
+ </button>
19
21
  {/if}
22
+
23
+ <style>
24
+ .button {
25
+ all: unset;
26
+ }
27
+ </style>
package/src/blocks/columns/columns.svelte CHANGED
@@ -5,6 +5,7 @@
5
5
  export let columns;
6
6
  export let stackColumnsAt;
7
7
  export let reverseColumnsWhenStacked;
8
+ export let builderBlock;
8
9
 
9
10
  function mitosis_styling(node, vars) {
10
11
  Object.entries(vars).forEach(([p, v]) => {
@@ -72,7 +73,11 @@
72
73
  }}
73
74
  class="builder-column div-2"
74
75
  >
75
- <RenderBlocks blocks={column.blocks} />
76
+ <RenderBlocks
77
+ blocks={column.blocks}
78
+ path={`component.options.columns.${index}.blocks`}
79
+ parent={builderBlock.id}
80
+ />
76
81
  </div>
77
82
  {/each}
78
83
  </div>
@@ -83,7 +88,7 @@
83
88
  align-items: stretch;
84
89
  line-height: normal;
85
90
  }
86
- @media (max-width: 999px) {
91
+ @media (max-width: 991px) {
87
92
  .div {
88
93
  flex-direction: var(--flex-dir-tablet);
89
94
  }
@@ -96,7 +101,7 @@
96
101
  .div-2 {
97
102
  flex-grow: 1;
98
103
  }
99
- @media (max-width: 999px) {
104
+ @media (max-width: 991px) {
100
105
  .div-2 {
101
106
  width: var(--column-width-tablet) !important;
102
107
  margin-left: var(--column-margin-left-tablet) !important;
package/src/components/render-content/render-content.svelte CHANGED
@@ -27,6 +27,7 @@
27
27
  export let context;
28
28
  export let customComponents;
29
29
  export let model;
30
+ export let canTrack;
30
31
  export let apiKey;
31
32
 
32
33
  const processMessage = function processMessage(event) {
@@ -71,6 +72,14 @@
71
72
  }
72
73
  };
73
74
 
75
+ const onClick = function onClick(_event) {
76
+ if (useContent() && canTrack !== false) {
77
+ track("click", {
78
+ contentId: useContent().id,
79
+ });
80
+ }
81
+ };
82
+
74
83
  const evalExpression = function evalExpression(expression) {
75
84
  return expression.replace(/{{([^}]+)}}/g, (_match, group) =>
76
85
  evaluate({
@@ -203,7 +212,7 @@
203
212
  );
204
213
  }
205
214
 
206
- if (useContent()) {
215
+ if (useContent() && canTrack !== false) {
207
216
  track("impression", {
208
217
  contentId: useContent().id,
209
218
  });
@@ -262,9 +271,7 @@
262
271
  {#if useContent()}
263
272
  <div
264
273
  on:click={(event) => {
265
- track("click", {
266
- contentId: useContent().id,
267
- });
274
+ onClick(event);
268
275
  }}
269
276
  builder-content-id={useContent?.()?.id}
270
277
  >