@revenuecat/purchases-ui-js 2.0.4 → 2.0.5

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 (40) hide show
  1. package/dist/components/button/ButtonNode.stories.svelte +1 -1
  2. package/dist/components/button/ButtonNode.svelte +11 -4
  3. package/dist/components/package/Package.svelte +3 -1
  4. package/dist/components/paywall/Node.svelte +9 -15
  5. package/dist/components/paywall/Node.svelte.d.ts +1 -7
  6. package/dist/components/paywall/Paywall.stories.svelte +155 -0
  7. package/dist/components/paywall/Paywall.svelte +45 -54
  8. package/dist/components/paywall/Sheet.svelte +126 -0
  9. package/dist/components/paywall/Sheet.svelte.d.ts +4 -0
  10. package/dist/components/paywall/fixtures/background-paywall.d.ts +3 -0
  11. package/dist/components/paywall/fixtures/background-paywall.js +62 -0
  12. package/dist/components/paywall/fixtures/sheet-paywall.d.ts +2 -0
  13. package/dist/components/paywall/fixtures/sheet-paywall.js +325 -0
  14. package/dist/components/tabs/TabControl.svelte +11 -0
  15. package/dist/components/tabs/TabControl.svelte.d.ts +4 -0
  16. package/dist/components/tabs/TabControlButton.svelte +19 -0
  17. package/dist/components/tabs/TabControlButton.svelte.d.ts +4 -0
  18. package/dist/components/tabs/Tabs.stories.svelte +929 -0
  19. package/dist/components/tabs/Tabs.stories.svelte.d.ts +19 -0
  20. package/dist/components/tabs/Tabs.svelte +69 -0
  21. package/dist/components/tabs/Tabs.svelte.d.ts +4 -0
  22. package/dist/components/tabs/tabs-context.d.ts +11 -0
  23. package/dist/components/tabs/tabs-context.js +12 -0
  24. package/dist/stores/selected.d.ts +1 -1
  25. package/dist/stores/selected.js +3 -5
  26. package/dist/types/component.d.ts +5 -4
  27. package/dist/types/components/button.d.ts +2 -1
  28. package/dist/types/components/sheet.d.ts +16 -0
  29. package/dist/types/components/sheet.js +1 -0
  30. package/dist/types/components/tabs.d.ts +46 -0
  31. package/dist/types/components/tabs.js +1 -0
  32. package/dist/types/paywall.d.ts +1 -2
  33. package/dist/types.d.ts +6 -2
  34. package/dist/utils/base-utils.d.ts +1 -1
  35. package/dist/utils/base-utils.js +2 -17
  36. package/dist/utils/style-utils.d.ts +2 -9
  37. package/dist/utils/style-utils.js +1 -23
  38. package/package.json +1 -1
  39. package/dist/components/paywall/paywall-utils.d.ts +0 -8
  40. package/dist/components/paywall/paywall-utils.js +0 -24
@@ -0,0 +1,325 @@
1
+ export const SHEET_PAYWALL = {
2
+ default_locale: "en_US",
3
+ components_localizations: {
4
+ en_US: {
5
+ "5GWqi3MXpt": "Sheet",
6
+ E6CK5Xd1cE: "Sheet button",
7
+ },
8
+ },
9
+ components_config: {
10
+ base: {
11
+ background: {
12
+ type: "color",
13
+ value: {
14
+ light: {
15
+ type: "hex",
16
+ value: "#ffffffff",
17
+ },
18
+ },
19
+ },
20
+ stack: {
21
+ background: null,
22
+ background_color: null,
23
+ badge: null,
24
+ border: null,
25
+ components: [
26
+ {
27
+ action: {
28
+ destination: "sheet",
29
+ sheet: {
30
+ background: null,
31
+ background_blur: true,
32
+ id: "ByNqcHZCBa",
33
+ name: "",
34
+ position: "bottom",
35
+ size: {
36
+ height: {
37
+ type: "relative",
38
+ value: 0.5,
39
+ },
40
+ width: {
41
+ type: "fill",
42
+ value: null,
43
+ },
44
+ },
45
+ stack: {
46
+ background: {
47
+ type: "color",
48
+ value: {
49
+ light: {
50
+ type: "hex",
51
+ value: "#ddffddff",
52
+ },
53
+ },
54
+ },
55
+ background_color: null,
56
+ badge: null,
57
+ border: {
58
+ color: {
59
+ light: {
60
+ type: "hex",
61
+ value: "#00aa00ff",
62
+ },
63
+ },
64
+ width: 3,
65
+ },
66
+ components: [
67
+ {
68
+ background_color: null,
69
+ color: {
70
+ light: {
71
+ type: "hex",
72
+ value: "#000000",
73
+ },
74
+ },
75
+ font_name: null,
76
+ font_size: 32,
77
+ font_weight: "regular",
78
+ font_weight_int: 400,
79
+ horizontal_alignment: "leading",
80
+ id: "_SFE-Jfx2H",
81
+ margin: {
82
+ bottom: 0,
83
+ leading: 0,
84
+ top: 0,
85
+ trailing: 0,
86
+ },
87
+ name: "",
88
+ padding: {
89
+ bottom: 0,
90
+ leading: 0,
91
+ top: 0,
92
+ trailing: 0,
93
+ },
94
+ size: {
95
+ height: {
96
+ type: "fit",
97
+ value: null,
98
+ },
99
+ width: {
100
+ type: "fit",
101
+ value: null,
102
+ },
103
+ },
104
+ text_lid: "5GWqi3MXpt",
105
+ type: "text",
106
+ },
107
+ ],
108
+ dimension: {
109
+ alignment: "center",
110
+ distribution: "center",
111
+ type: "vertical",
112
+ },
113
+ id: "vtyGD4yg8U",
114
+ margin: {
115
+ bottom: 0,
116
+ leading: 32,
117
+ top: 0,
118
+ trailing: 32,
119
+ },
120
+ name: "Sheet Content",
121
+ padding: {
122
+ bottom: 32,
123
+ leading: 32,
124
+ top: 32,
125
+ trailing: 32,
126
+ },
127
+ shadow: {
128
+ color: {
129
+ light: {
130
+ type: "hex",
131
+ value: "#ff000040",
132
+ },
133
+ },
134
+ radius: 16,
135
+ x: 0,
136
+ y: -8,
137
+ },
138
+ shape: {
139
+ corners: {
140
+ bottom_leading: 0,
141
+ bottom_trailing: 0,
142
+ top_leading: 32,
143
+ top_trailing: 32,
144
+ },
145
+ type: "rectangle",
146
+ },
147
+ size: {
148
+ height: {
149
+ type: "fill",
150
+ value: null,
151
+ },
152
+ width: {
153
+ type: "fill",
154
+ value: null,
155
+ },
156
+ },
157
+ spacing: 0,
158
+ type: "stack",
159
+ },
160
+ type: "sheet",
161
+ },
162
+ type: "navigate_to",
163
+ },
164
+ id: "dTnaiaphr5",
165
+ name: "",
166
+ stack: {
167
+ background: {
168
+ type: "color",
169
+ value: {
170
+ light: {
171
+ type: "hex",
172
+ value: "#ddffddff",
173
+ },
174
+ },
175
+ },
176
+ background_color: null,
177
+ badge: null,
178
+ border: {
179
+ color: {
180
+ light: {
181
+ type: "hex",
182
+ value: "#00aa00ff",
183
+ },
184
+ },
185
+ width: 1,
186
+ },
187
+ components: [
188
+ {
189
+ background_color: null,
190
+ color: {
191
+ light: {
192
+ type: "hex",
193
+ value: "#000000",
194
+ },
195
+ },
196
+ font_name: null,
197
+ font_size: 14,
198
+ font_weight: "regular",
199
+ font_weight_int: 400,
200
+ horizontal_alignment: "leading",
201
+ id: "o7XZa4SJLW",
202
+ margin: {
203
+ bottom: 0,
204
+ leading: 0,
205
+ top: 0,
206
+ trailing: 0,
207
+ },
208
+ name: "",
209
+ padding: {
210
+ bottom: 0,
211
+ leading: 0,
212
+ top: 0,
213
+ trailing: 0,
214
+ },
215
+ size: {
216
+ height: {
217
+ type: "fit",
218
+ value: null,
219
+ },
220
+ width: {
221
+ type: "fit",
222
+ value: null,
223
+ },
224
+ },
225
+ text_lid: "E6CK5Xd1cE",
226
+ type: "text",
227
+ },
228
+ ],
229
+ dimension: {
230
+ alignment: "leading",
231
+ distribution: "start",
232
+ type: "vertical",
233
+ },
234
+ id: "el3qmQd6hR",
235
+ margin: {
236
+ bottom: 0,
237
+ leading: 0,
238
+ top: 0,
239
+ trailing: 0,
240
+ },
241
+ name: "",
242
+ padding: {
243
+ bottom: 16,
244
+ leading: 16,
245
+ top: 16,
246
+ trailing: 16,
247
+ },
248
+ shadow: {
249
+ color: {
250
+ light: {
251
+ type: "hex",
252
+ value: "#ff000040",
253
+ },
254
+ },
255
+ radius: 16,
256
+ x: 8,
257
+ y: 8,
258
+ },
259
+ shape: {
260
+ corners: null,
261
+ type: "pill",
262
+ },
263
+ size: {
264
+ height: {
265
+ type: "fit",
266
+ value: null,
267
+ },
268
+ width: {
269
+ type: "fit",
270
+ value: null,
271
+ },
272
+ },
273
+ spacing: 0,
274
+ type: "stack",
275
+ },
276
+ transition: null,
277
+ type: "button",
278
+ },
279
+ ],
280
+ dimension: {
281
+ alignment: "center",
282
+ distribution: "start",
283
+ type: "vertical",
284
+ },
285
+ id: "rocJhuHfiP",
286
+ margin: {
287
+ bottom: 0,
288
+ leading: 0,
289
+ top: 0,
290
+ trailing: 0,
291
+ },
292
+ name: "Content",
293
+ padding: {
294
+ bottom: 0,
295
+ leading: 0,
296
+ top: 0,
297
+ trailing: 0,
298
+ },
299
+ shadow: null,
300
+ shape: {
301
+ corners: {
302
+ bottom_leading: 0,
303
+ bottom_trailing: 0,
304
+ top_leading: 0,
305
+ top_trailing: 0,
306
+ },
307
+ type: "rectangle",
308
+ },
309
+ size: {
310
+ height: {
311
+ type: "fit",
312
+ value: null,
313
+ },
314
+ width: {
315
+ type: "fill",
316
+ value: null,
317
+ },
318
+ },
319
+ spacing: 16,
320
+ type: "stack",
321
+ },
322
+ sticky_footer: null,
323
+ },
324
+ },
325
+ };
@@ -0,0 +1,11 @@
1
+ <script lang="ts">
2
+ import type { TabControlProps } from "../../types/components/tabs";
3
+ import Stack from "../stack/Stack.svelte";
4
+ import { getTabsContext } from "./tabs-context";
5
+
6
+ const _: TabControlProps = $props();
7
+
8
+ const { control } = getTabsContext();
9
+ </script>
10
+
11
+ <Stack {...$control.stack} />
@@ -0,0 +1,4 @@
1
+ import type { TabControlProps } from "../../types/components/tabs";
2
+ declare const TabControl: import("svelte").Component<TabControlProps, {}, "">;
3
+ type TabControl = ReturnType<typeof TabControl>;
4
+ export default TabControl;
@@ -0,0 +1,19 @@
1
+ <script lang="ts">
2
+ import { setSelectedStateContext } from "../../stores/selected";
3
+ import type { TabControlButtonProps } from "../../types/components/tabs";
4
+ import { derived } from "svelte/store";
5
+ import Stack from "../stack/Stack.svelte";
6
+ import { getTabsContext } from "./tabs-context";
7
+
8
+ const { stack, tab_id, tab_index }: TabControlButtonProps = $props();
9
+
10
+ const { selectedTabId, selectTab } = getTabsContext();
11
+
12
+ setSelectedStateContext(derived(selectedTabId, (value) => value === tab_id));
13
+
14
+ const onclick = () => {
15
+ selectTab(tab_id, tab_index);
16
+ };
17
+ </script>
18
+
19
+ <Stack {...stack} {onclick}></Stack>
@@ -0,0 +1,4 @@
1
+ import type { TabControlButtonProps } from "../../types/components/tabs";
2
+ declare const TabControlButton: import("svelte").Component<TabControlButtonProps, {}, "">;
3
+ type TabControlButton = ReturnType<typeof TabControlButton>;
4
+ export default TabControlButton;