@revenuecat/purchases-ui-js 0.0.17 → 0.0.19

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 (48) hide show
  1. package/dist/components/button/Button.svelte +0 -13
  2. package/dist/components/button/ButtonNode.stories.svelte +16 -9
  3. package/dist/components/button/ButtonNode.svelte +26 -1
  4. package/dist/components/button/button-utils.d.ts +2 -0
  5. package/dist/components/button/button-utils.js +19 -0
  6. package/dist/components/footer/Footer.stories.svelte +2 -0
  7. package/dist/components/footer/Footer.svelte +14 -8
  8. package/dist/components/image/Image.stories.svelte +6 -2
  9. package/dist/components/image/Image.svelte +20 -17
  10. package/dist/components/image/image-utils.d.ts +2 -12
  11. package/dist/components/image/image-utils.js +27 -10
  12. package/dist/components/package/Package.stories.svelte +5 -3
  13. package/dist/components/package/Package.svelte +15 -6
  14. package/dist/components/paywall/Node.svelte +75 -19
  15. package/dist/components/paywall/Node.svelte.d.ts +20 -2
  16. package/dist/components/paywall/Paywall.stories.svelte +80 -5
  17. package/dist/components/paywall/Paywall.svelte +74 -71
  18. package/dist/components/paywall/paywall-utils.d.ts +1 -1
  19. package/dist/components/paywall/paywall-utils.js +11 -9
  20. package/dist/components/purchase-button/PurchaseButton.stories.svelte +13 -6
  21. package/dist/components/purchase-button/PurchaseButton.svelte +24 -10
  22. package/dist/components/purchase-button/purchase-button-utils.d.ts +2 -0
  23. package/dist/components/purchase-button/purchase-button-utils.js +20 -0
  24. package/dist/components/stack/Stack.stories.svelte +1138 -4
  25. package/dist/components/stack/Stack.svelte +162 -45
  26. package/dist/components/stack/stack-utils.d.ts +24 -24
  27. package/dist/components/stack/stack-utils.js +245 -12
  28. package/dist/components/text/Text.svelte +24 -19
  29. package/dist/components/text/TextNode.stories.svelte +12 -11
  30. package/dist/components/text/TextNode.svelte +21 -24
  31. package/dist/components/text/text-utils.d.ts +9 -15
  32. package/dist/components/text/text-utils.js +123 -8
  33. package/dist/components/timeline/Timeline.svelte +10 -10
  34. package/dist/components/timeline/TimelineItem.svelte +45 -33
  35. package/dist/components/timeline/timeline-utils.d.ts +3 -20
  36. package/dist/components/timeline/timeline-utils.js +46 -11
  37. package/dist/data/entities.d.ts +41 -11
  38. package/dist/index.d.ts +2 -2
  39. package/dist/index.js +2 -2
  40. package/dist/stories/fixtures.d.ts +3 -1
  41. package/dist/stories/fixtures.js +7581 -3120
  42. package/dist/types.d.ts +4 -3
  43. package/dist/utils/style-utils.d.ts +72 -63
  44. package/dist/utils/style-utils.js +120 -102
  45. package/dist/utils/variable-utils.d.ts +27 -0
  46. package/dist/utils/variable-utils.js +37 -0
  47. package/package.json +3 -2
  48. package/dist/components/paywall/global-styles.css +0 -9
@@ -1,6 +1,7 @@
1
- import type { BorderType, CircleShape, ColorType, CornerRadiusType, DimensionType, FitTypes, FontSizeTags, FontWeights, RectangleShape, ShadowType, ShapeType, SizeType, Spacing, TextAlignments } from "../types";
1
+ import type { AlignmentType, BorderType, CircleShape, ColorType, CornerRadiusType, DimensionType, FitTypes, FontSizeTags, FontWeights, RectangleShape, ShadowType, ShapeType, SizeType, Spacing, TextAlignments } from "../types";
2
2
  import type { PurchaseState } from "./state";
3
3
  import type { VariableDictionary } from "../utils/variable-utils";
4
+ import type { ZStackChildStyles } from "../components/stack/stack-utils";
4
5
  export interface Extra {
5
6
  [key: string]: unknown;
6
7
  }
@@ -9,6 +10,7 @@ export interface PaywallComponent extends Extra {
9
10
  type: ComponentTypes;
10
11
  id: string;
11
12
  name: string;
13
+ fallback?: PaywallComponent;
12
14
  }
13
15
  export interface Stack extends PaywallComponent {
14
16
  spacing: number;
@@ -21,6 +23,8 @@ type BaseNodeBackgroundColor = {
21
23
  export type BaseNodeBackgroundImage = {
22
24
  type: "image";
23
25
  value: ImageSourceType;
26
+ color_overlay?: ColorType;
27
+ fit_mode?: FitTypes;
24
28
  };
25
29
  export type BaseNodeBackgroundType = BaseNodeBackgroundColor | BaseNodeBackgroundImage;
26
30
  export interface ComponentConfig {
@@ -70,10 +74,16 @@ interface SharedComponentProps extends PaywallComponent, ActionsProps, PurchaseS
70
74
  name: string;
71
75
  variableDictionary?: VariableDictionary;
72
76
  componentState?: ComponentState;
77
+ zStackChildStyles?: ZStackChildStyles;
73
78
  }
74
79
  interface Action {
75
80
  type: "restore_purchases" | "navigate_to" | "navigate_back" | "purchase" | "select_package";
76
81
  }
82
+ type OverrideProps<T> = {
83
+ states?: {
84
+ [state: string]: T;
85
+ };
86
+ };
77
87
  export interface RestorePurchasesAction extends Action {
78
88
  type: "restore_purchases";
79
89
  }
@@ -126,9 +136,25 @@ export interface StackProps extends SharedComponentProps {
126
136
  size: SizeType;
127
137
  spacing?: number;
128
138
  type: "stack";
129
- overrides?: {
130
- [state: string]: StackProps;
139
+ badge?: {
140
+ stack: {
141
+ components: PaywallComponent[];
142
+ type: "stack";
143
+ };
144
+ style: "overlay" | "edge_to_edge" | "nested";
145
+ alignment: Exclude<AlignmentType, "center">;
146
+ shape: ShapeType;
147
+ padding: Spacing;
148
+ margin: Spacing;
149
+ text_lid: string;
150
+ color: ColorType;
151
+ font_name?: string;
152
+ font_weight: keyof typeof FontWeights;
153
+ font_size: keyof typeof FontSizeTags;
154
+ horizontal_alignment: keyof typeof TextAlignments;
155
+ background_color: ColorType;
131
156
  };
157
+ overrides?: OverrideProps<StackProps>;
132
158
  }
133
159
  export interface TextNodeProps extends SharedComponentProps {
134
160
  background_color?: ColorType;
@@ -144,11 +170,17 @@ export interface TextNodeProps extends SharedComponentProps {
144
170
  type: "text";
145
171
  size: SizeType;
146
172
  variableDictionary?: VariableDictionary;
147
- overrides?: {
148
- [state: string]: TextNodeProps;
149
- };
150
- }
151
- type ImageSourceDictionaryType = Record<"original" | "heic" | "heic_low_res" | "webp" | "webp_low_res", string>;
173
+ overrides?: OverrideProps<TextNodeProps>;
174
+ }
175
+ type ImageSourceDictionaryType = {
176
+ original: string;
177
+ heic: string;
178
+ heic_low_res: string;
179
+ webp: string;
180
+ webp_low_res: string;
181
+ width?: number;
182
+ height?: number;
183
+ };
152
184
  type ImageSourceType = {
153
185
  light: ImageSourceDictionaryType;
154
186
  dark?: ImageSourceDictionaryType;
@@ -166,9 +198,7 @@ export interface ImageProps extends SharedComponentProps {
166
198
  mask_shape?: ImageMaskShapeType;
167
199
  max_height?: number;
168
200
  override_source_lid?: string;
169
- overrides?: {
170
- [state: string]: ImageProps;
171
- };
201
+ overrides?: OverrideProps<ImageProps>;
172
202
  }
173
203
  export type ItemProps = {
174
204
  title: {
package/dist/index.d.ts CHANGED
@@ -1,5 +1,6 @@
1
- export { type PaywallData as PaywallData } from "./data/entities";
2
1
  export * from "./types";
2
+ export { type PaywallData as PaywallData } from "./data/entities";
3
+ export { type VariableDictionary } from "./utils/variable-utils";
3
4
  export { default as Paywall } from "./components/paywall/Paywall.svelte";
4
5
  export { default as Stack } from "./components/stack/Stack.svelte";
5
6
  export { default as Button } from "./components/button/Button.svelte";
@@ -8,5 +9,4 @@ export { default as Image } from "./components/image/Image.svelte";
8
9
  export { default as PurchaseButton } from "./components/purchase-button/PurchaseButton.svelte";
9
10
  export { default as Package } from "./components/package/Package.svelte";
10
11
  export { default as Footer } from "./components/footer/Footer.svelte";
11
- export { type VariableDictionary } from "./utils/variable-utils";
12
12
  export { default as Timeline } from "./components/timeline/Timeline.svelte";
package/dist/index.js CHANGED
@@ -1,6 +1,7 @@
1
1
  // Reexport your entry components here
2
- export {} from "./data/entities";
3
2
  export * from "./types";
3
+ export {} from "./data/entities";
4
+ export {} from "./utils/variable-utils";
4
5
  export { default as Paywall } from "./components/paywall/Paywall.svelte";
5
6
  export { default as Stack } from "./components/stack/Stack.svelte";
6
7
  export { default as Button } from "./components/button/Button.svelte";
@@ -9,5 +10,4 @@ export { default as Image } from "./components/image/Image.svelte";
9
10
  export { default as PurchaseButton } from "./components/purchase-button/PurchaseButton.svelte";
10
11
  export { default as Package } from "./components/package/Package.svelte";
11
12
  export { default as Footer } from "./components/footer/Footer.svelte";
12
- export {} from "./utils/variable-utils";
13
13
  export { default as Timeline } from "./components/timeline/Timeline.svelte";
@@ -8,15 +8,17 @@ export declare const gradientPaywallData: PaywallData;
8
8
  export declare const calmPaywallData: PaywallData;
9
9
  export declare const stateTemplate: PaywallData;
10
10
  export declare const posterMakerTemplate: PaywallData;
11
- export declare const e2eTestTemplate: PaywallData;
12
11
  export declare const zStackTemplate: PaywallData;
13
12
  export declare const labelsData: {
14
13
  en_US: {
15
14
  id1: string;
16
15
  id2: string;
17
16
  id3: string;
17
+ badge: string;
18
18
  };
19
19
  };
20
20
  export declare const colorModeOverrideTemplate: PaywallData;
21
21
  export declare const paywallWithFooter: PaywallData;
22
22
  export declare const errorPaywallData: PaywallData;
23
+ export declare const fallbackPaywallData: PaywallData;
24
+ export declare const e2eTestTemplate: PaywallData;