@saasquatch/mint-components 2.1.10-54 → 2.1.10-56

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.
@@ -7878,18 +7878,21 @@ const TimelineReward = class {
7878
7878
  };
7879
7879
 
7880
7880
  function UserAttributeView(props) {
7881
- const vanillaStyle = `
7882
- p {
7883
- margin: 0;
7884
- padding: 0;
7885
- ${props.fontsize && `font-size: ${props.fontsize};`}
7886
- ${props.fontweight && `font-weight: ${props.fontweight};`}
7887
- color: ${props.color ? props.color : "var(--sqm-text)"};
7888
- }`;
7881
+ const style = {
7882
+ P: {
7883
+ margin: "0",
7884
+ padding: "0",
7885
+ fontSize: props.fontsize || "inherit",
7886
+ fontWeight: props.fontweight || "inherit",
7887
+ color: props.color || "var(--sqm-text)",
7888
+ },
7889
+ };
7890
+ const sheet = JSS.createStyleSheet(style);
7891
+ const styleString = sheet.toString();
7889
7892
  const loadingSkeleton = (index.h("sqm-skeleton", { width: "200px", height: "20px" }));
7890
7893
  return (props.value && (index.h(index.Host, null,
7891
- index.h("style", null, vanillaStyle),
7892
- index.h("p", { part: "sqm-base" }, props.loading ? loadingSkeleton : props.value))));
7894
+ index.h("style", null, styleString),
7895
+ index.h("p", { class: sheet.classes.P, part: "sqm-base" }, props.loading ? loadingSkeleton : props.value))));
7893
7896
  }
7894
7897
 
7895
7898
  const GET_CUSTOM_FIELDS = index_module.dist.gql `
@@ -1,15 +1,19 @@
1
1
  import { h, Host } from "@stencil/core";
2
+ import { createStyleSheet } from "../../styling/JSS";
2
3
  export function UserAttributeView(props) {
3
- const vanillaStyle = `
4
- p {
5
- margin: 0;
6
- padding: 0;
7
- ${props.fontsize && `font-size: ${props.fontsize};`}
8
- ${props.fontweight && `font-weight: ${props.fontweight};`}
9
- color: ${props.color ? props.color : "var(--sqm-text)"};
10
- }`;
4
+ const style = {
5
+ P: {
6
+ margin: "0",
7
+ padding: "0",
8
+ fontSize: props.fontsize || "inherit",
9
+ fontWeight: props.fontweight || "inherit",
10
+ color: props.color || "var(--sqm-text)",
11
+ },
12
+ };
13
+ const sheet = createStyleSheet(style);
14
+ const styleString = sheet.toString();
11
15
  const loadingSkeleton = (h("sqm-skeleton", { width: "200px", height: "20px" }));
12
16
  return (props.value && (h(Host, null,
13
- h("style", null, vanillaStyle),
14
- h("p", { part: "sqm-base" }, props.loading ? loadingSkeleton : props.value))));
17
+ h("style", null, styleString),
18
+ h("p", { class: sheet.classes.P, part: "sqm-base" }, props.loading ? loadingSkeleton : props.value))));
15
19
  }
@@ -7874,18 +7874,21 @@ const TimelineReward = class {
7874
7874
  };
7875
7875
 
7876
7876
  function UserAttributeView(props) {
7877
- const vanillaStyle = `
7878
- p {
7879
- margin: 0;
7880
- padding: 0;
7881
- ${props.fontsize && `font-size: ${props.fontsize};`}
7882
- ${props.fontweight && `font-weight: ${props.fontweight};`}
7883
- color: ${props.color ? props.color : "var(--sqm-text)"};
7884
- }`;
7877
+ const style = {
7878
+ P: {
7879
+ margin: "0",
7880
+ padding: "0",
7881
+ fontSize: props.fontsize || "inherit",
7882
+ fontWeight: props.fontweight || "inherit",
7883
+ color: props.color || "var(--sqm-text)",
7884
+ },
7885
+ };
7886
+ const sheet = createStyleSheet(style);
7887
+ const styleString = sheet.toString();
7885
7888
  const loadingSkeleton = (h$1("sqm-skeleton", { width: "200px", height: "20px" }));
7886
7889
  return (props.value && (h$1(Host, null,
7887
- h$1("style", null, vanillaStyle),
7888
- h$1("p", { part: "sqm-base" }, props.loading ? loadingSkeleton : props.value))));
7890
+ h$1("style", null, styleString),
7891
+ h$1("p", { class: sheet.classes.P, part: "sqm-base" }, props.loading ? loadingSkeleton : props.value))));
7889
7892
  }
7890
7893
 
7891
7894
  const GET_CUSTOM_FIELDS = dist.gql `