@telia/teddy 0.4.14 → 0.4.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.
- package/dist/components/card/card-button.cjs +12 -0
- package/dist/components/card/card-button.js +12 -0
- package/dist/components/card/card-heading.cjs +3 -0
- package/dist/components/card/card-heading.js +3 -0
- package/dist/components/card/card-price.cjs +1 -2
- package/dist/components/card/card-price.js +1 -2
- package/package.json +1 -1
|
@@ -16,6 +16,17 @@ function getButtonVariant(variant) {
|
|
|
16
16
|
return "primary";
|
|
17
17
|
}
|
|
18
18
|
}
|
|
19
|
+
const getButtonSize = (layout) => {
|
|
20
|
+
switch (layout) {
|
|
21
|
+
case "navigation-vertical":
|
|
22
|
+
case "navigation-horizontal-small":
|
|
23
|
+
case "navigation-horizontal-small-centered":
|
|
24
|
+
case "navigation-horizontal-large":
|
|
25
|
+
return "sm";
|
|
26
|
+
default:
|
|
27
|
+
return "md";
|
|
28
|
+
}
|
|
29
|
+
};
|
|
19
30
|
const Button = React.forwardRef(
|
|
20
31
|
({ className, iconOnly, disclaimer, ...props }, forwardRef) => {
|
|
21
32
|
const context = React.useContext(components_card_card.RootContext);
|
|
@@ -37,6 +48,7 @@ const Button = React.forwardRef(
|
|
|
37
48
|
ref,
|
|
38
49
|
...!iconOnly || !props["aria-label"] ? { iconOnly: false, "aria-label": void 0 } : { iconOnly: true, "aria-label": props["aria-label"] },
|
|
39
50
|
variant: getButtonVariant(context == null ? void 0 : context.variant),
|
|
51
|
+
size: getButtonSize(context == null ? void 0 : context.layout),
|
|
40
52
|
...props,
|
|
41
53
|
className: classes
|
|
42
54
|
}
|
|
@@ -14,6 +14,17 @@ function getButtonVariant(variant) {
|
|
|
14
14
|
return "primary";
|
|
15
15
|
}
|
|
16
16
|
}
|
|
17
|
+
const getButtonSize = (layout) => {
|
|
18
|
+
switch (layout) {
|
|
19
|
+
case "navigation-vertical":
|
|
20
|
+
case "navigation-horizontal-small":
|
|
21
|
+
case "navigation-horizontal-small-centered":
|
|
22
|
+
case "navigation-horizontal-large":
|
|
23
|
+
return "sm";
|
|
24
|
+
default:
|
|
25
|
+
return "md";
|
|
26
|
+
}
|
|
27
|
+
};
|
|
17
28
|
const Button = React__default.forwardRef(
|
|
18
29
|
({ className, iconOnly, disclaimer, ...props }, forwardRef) => {
|
|
19
30
|
const context = React__default.useContext(RootContext);
|
|
@@ -35,6 +46,7 @@ const Button = React__default.forwardRef(
|
|
|
35
46
|
ref,
|
|
36
47
|
...!iconOnly || !props["aria-label"] ? { iconOnly: false, "aria-label": void 0 } : { iconOnly: true, "aria-label": props["aria-label"] },
|
|
37
48
|
variant: getButtonVariant(context == null ? void 0 : context.variant),
|
|
49
|
+
size: getButtonSize(context == null ? void 0 : context.layout),
|
|
38
50
|
...props,
|
|
39
51
|
className: classes
|
|
40
52
|
}
|
|
@@ -14,13 +14,12 @@ const Price = React.forwardRef(
|
|
|
14
14
|
return /* @__PURE__ */ jsxRuntime.jsxs(components_flex_flex.Flex, { flexGrow: "1", mt: "auto", mb: "100", ref: forwardRef, className: classes, direction: "column", gap: "10", children: [
|
|
15
15
|
textAbovePrice ? /* @__PURE__ */ jsxRuntime.jsx(components_text_text.Text, { variant: "additional-100", as: "p", faded: true, children: textAbovePrice }) : null,
|
|
16
16
|
/* @__PURE__ */ jsxRuntime.jsxs(components_flex_flex.Flex, { direction: "row", align: "baseline", flexGrow: "1", wrap: "nowrap", children: [
|
|
17
|
-
pricePrefix && /* @__PURE__ */ jsxRuntime.jsx(components_text_text.Text, { variant: "paragraph-200", as: "p", faded: true, children: pricePrefix }),
|
|
17
|
+
pricePrefix && /* @__PURE__ */ jsxRuntime.jsx(components_text_text.Text, { variant: "paragraph-200", as: "p", faded: true, mr: "100", children: pricePrefix }),
|
|
18
18
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
19
19
|
components_text_text.Text,
|
|
20
20
|
{
|
|
21
21
|
variant: "paragraph-100-bold",
|
|
22
22
|
as: "span",
|
|
23
|
-
ml: "100",
|
|
24
23
|
mr: "100",
|
|
25
24
|
color: variant === "purple" ? tokens_color_variables.teddyColorBrandCorePurple : void 0,
|
|
26
25
|
className: components_card_card.styles[`${rootColorDotsClass}--big`],
|
|
@@ -12,13 +12,12 @@ const Price = React__default.forwardRef(
|
|
|
12
12
|
return /* @__PURE__ */ jsxs(Flex, { flexGrow: "1", mt: "auto", mb: "100", ref: forwardRef, className: classes, direction: "column", gap: "10", children: [
|
|
13
13
|
textAbovePrice ? /* @__PURE__ */ jsx(Text, { variant: "additional-100", as: "p", faded: true, children: textAbovePrice }) : null,
|
|
14
14
|
/* @__PURE__ */ jsxs(Flex, { direction: "row", align: "baseline", flexGrow: "1", wrap: "nowrap", children: [
|
|
15
|
-
pricePrefix && /* @__PURE__ */ jsx(Text, { variant: "paragraph-200", as: "p", faded: true, children: pricePrefix }),
|
|
15
|
+
pricePrefix && /* @__PURE__ */ jsx(Text, { variant: "paragraph-200", as: "p", faded: true, mr: "100", children: pricePrefix }),
|
|
16
16
|
/* @__PURE__ */ jsx(
|
|
17
17
|
Text,
|
|
18
18
|
{
|
|
19
19
|
variant: "paragraph-100-bold",
|
|
20
20
|
as: "span",
|
|
21
|
-
ml: "100",
|
|
22
21
|
mr: "100",
|
|
23
22
|
color: variant === "purple" ? teddyColorBrandCorePurple : void 0,
|
|
24
23
|
className: styles[`${rootColorDotsClass}--big`],
|