@telia/teddy 0.4.8 → 0.4.9

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 (9) hide show
  1. package/dist/components/flip-card/flip-card-back.cjs +26 -13
  2. package/dist/components/flip-card/flip-card-back.js +28 -15
  3. package/dist/components/flip-card/flip-card-footer.cjs +4 -1
  4. package/dist/components/flip-card/flip-card-footer.js +5 -2
  5. package/dist/components/flip-card/flip-card-root.cjs +17 -15
  6. package/dist/components/flip-card/flip-card-root.d.ts +1 -0
  7. package/dist/components/flip-card/flip-card-root.js +17 -15
  8. package/dist/style.css +20 -18
  9. package/package.json +1 -1
package/dist/components/flip-card/flip-card-back.cjs CHANGED
@@ -7,10 +7,20 @@ const components_flipCard_flipCardRoot = require("./flip-card-root.cjs");
7
7
  const components_card_index = require("../card/index.cjs");
8
8
  const components_scrollArea_index = require("../scroll-area/index.cjs");
9
9
  const utils_composeRefs = require("../../utils/composeRefs.cjs");
10
+ const utils_useLayoutEffect = require("../../utils/useLayoutEffect.cjs");
11
+ const components_box_box = require("../box/box.cjs");
10
12
  const BackContext = React.createContext({});
11
13
  const Back = React.forwardRef(
12
14
  ({ className, variant, shadow, bordered, children, wrapperClassName, "aria-label": ariaLabel, ...props }, forwardRef) => {
13
- const { flipped, backId, backRef } = React.useContext(components_flipCard_flipCardRoot.FlipContext);
15
+ var _a;
16
+ const [footerHeight, setFooterHeight] = React.useState();
17
+ const { flipped, backId, backRef, footerRef } = React.useContext(components_flipCard_flipCardRoot.FlipContext);
18
+ const hasFooter = (footerRef == null ? void 0 : footerRef.current) && ((_a = backRef == null ? void 0 : backRef.current) == null ? void 0 : _a.contains(footerRef.current));
19
+ utils_useLayoutEffect.useLayoutEffect(() => {
20
+ if (footerRef == null ? void 0 : footerRef.current) {
21
+ setFooterHeight(`${footerRef.current.getBoundingClientRect().height}px`);
22
+ }
23
+ }, [footerRef]);
14
24
  const ref = utils_composeRefs.useComposedRefs(forwardRef, backRef);
15
25
  const classesOuter = clsx(
16
26
  [components_flipCard_flipCardRoot.styles[`${components_flipCard_flipCardRoot.rootClassName}__back`]],
@@ -20,18 +30,21 @@ const Back = React.forwardRef(
20
30
  wrapperClassName
21
31
  );
22
32
  const classesInner = clsx([components_flipCard_flipCardRoot.styles[`${components_flipCard_flipCardRoot.rootClassName}__back-inner`]], className);
23
- return /* @__PURE__ */ jsxRuntime.jsx(BackContext.Provider, { value: { variant }, children: /* @__PURE__ */ jsxRuntime.jsx(components_card_index.Card, { variant, shadow, bordered, className: classesOuter, children: /* @__PURE__ */ jsxRuntime.jsx(components_scrollArea_index.ScrollArea, { viewPortClassName: components_flipCard_flipCardRoot.styles[`${components_flipCard_flipCardRoot.rootClassName}__scroll-area-view-port`], children: /* @__PURE__ */ jsxRuntime.jsx(
24
- components_card_index.Card,
25
- {
26
- id: backId,
27
- role: "region",
28
- "aria-label": ariaLabel || "Bakside innhold",
29
- ...props,
30
- ref,
31
- className: classesInner,
32
- children
33
- }
34
- ) }) }) });
33
+ return /* @__PURE__ */ jsxRuntime.jsx(BackContext.Provider, { value: { variant }, children: /* @__PURE__ */ jsxRuntime.jsx(components_card_index.Card, { variant, shadow, bordered, className: classesOuter, children: /* @__PURE__ */ jsxRuntime.jsxs(components_scrollArea_index.ScrollArea, { viewPortClassName: components_flipCard_flipCardRoot.styles[`${components_flipCard_flipCardRoot.rootClassName}__scroll-area-view-port`], children: [
34
+ /* @__PURE__ */ jsxRuntime.jsx(
35
+ components_card_index.Card,
36
+ {
37
+ id: backId,
38
+ role: "region",
39
+ "aria-label": ariaLabel || "Bakside innhold",
40
+ ...props,
41
+ ref,
42
+ className: classesInner,
43
+ children
44
+ }
45
+ ),
46
+ hasFooter && /* @__PURE__ */ jsxRuntime.jsx(components_box_box.Box, { height: footerHeight })
47
+ ] }) }) });
35
48
  }
36
49
  );
37
50
  Back.displayName = "Back";
package/dist/components/flip-card/flip-card-back.js CHANGED
@@ -1,14 +1,24 @@
1
- import { jsx } from "react/jsx-runtime";
2
- import React__default, { useContext } from "react";
1
+ import { jsx, jsxs } from "react/jsx-runtime";
2
+ import React__default, { useState, useContext } from "react";
3
3
  import clsx from "clsx";
4
4
  import { FlipContext, s as styles, rootClassName } from "./flip-card-root.js";
5
5
  import { Card } from "../card/index.js";
6
6
  import { ScrollArea } from "../scroll-area/index.js";
7
7
  import { useComposedRefs } from "../../utils/composeRefs.js";
8
+ import { useLayoutEffect } from "../../utils/useLayoutEffect.js";
9
+ import { Box } from "../box/box.js";
8
10
  const BackContext = React__default.createContext({});
9
11
  const Back = React__default.forwardRef(
10
12
  ({ className, variant, shadow, bordered, children, wrapperClassName, "aria-label": ariaLabel, ...props }, forwardRef) => {
11
- const { flipped, backId, backRef } = useContext(FlipContext);
13
+ var _a;
14
+ const [footerHeight, setFooterHeight] = useState();
15
+ const { flipped, backId, backRef, footerRef } = useContext(FlipContext);
16
+ const hasFooter = (footerRef == null ? void 0 : footerRef.current) && ((_a = backRef == null ? void 0 : backRef.current) == null ? void 0 : _a.contains(footerRef.current));
17
+ useLayoutEffect(() => {
18
+ if (footerRef == null ? void 0 : footerRef.current) {
19
+ setFooterHeight(`${footerRef.current.getBoundingClientRect().height}px`);
20
+ }
21
+ }, [footerRef]);
12
22
  const ref = useComposedRefs(forwardRef, backRef);
13
23
  const classesOuter = clsx(
14
24
  [styles[`${rootClassName}__back`]],
@@ -18,18 +28,21 @@ const Back = React__default.forwardRef(
18
28
  wrapperClassName
19
29
  );
20
30
  const classesInner = clsx([styles[`${rootClassName}__back-inner`]], className);
21
- return /* @__PURE__ */ jsx(BackContext.Provider, { value: { variant }, children: /* @__PURE__ */ jsx(Card, { variant, shadow, bordered, className: classesOuter, children: /* @__PURE__ */ jsx(ScrollArea, { viewPortClassName: styles[`${rootClassName}__scroll-area-view-port`], children: /* @__PURE__ */ jsx(
22
- Card,
23
- {
24
- id: backId,
25
- role: "region",
26
- "aria-label": ariaLabel || "Bakside innhold",
27
- ...props,
28
- ref,
29
- className: classesInner,
30
- children
31
- }
32
- ) }) }) });
31
+ return /* @__PURE__ */ jsx(BackContext.Provider, { value: { variant }, children: /* @__PURE__ */ jsx(Card, { variant, shadow, bordered, className: classesOuter, children: /* @__PURE__ */ jsxs(ScrollArea, { viewPortClassName: styles[`${rootClassName}__scroll-area-view-port`], children: [
32
+ /* @__PURE__ */ jsx(
33
+ Card,
34
+ {
35
+ id: backId,
36
+ role: "region",
37
+ "aria-label": ariaLabel || "Bakside innhold",
38
+ ...props,
39
+ ref,
40
+ className: classesInner,
41
+ children
42
+ }
43
+ ),
44
+ hasFooter && /* @__PURE__ */ jsx(Box, { height: footerHeight })
45
+ ] }) }) });
33
46
  }
34
47
  );
35
48
  Back.displayName = "Back";
package/dist/components/flip-card/flip-card-footer.cjs CHANGED
@@ -5,9 +5,12 @@ const React = require("react");
5
5
  const clsx = require("clsx");
6
6
  const components_flipCard_flipCardRoot = require("./flip-card-root.cjs");
7
7
  const components_flipCard_flipCardBack = require("./flip-card-back.cjs");
8
+ const utils_composeRefs = require("../../utils/composeRefs.cjs");
8
9
  const Footer = React.forwardRef(
9
10
  ({ className, children, ...props }, forwardRef) => {
10
11
  const { variant: backVariant } = React.useContext(components_flipCard_flipCardBack.BackContext);
12
+ const { footerRef } = React.useContext(components_flipCard_flipCardRoot.FlipContext);
13
+ const composedRef = utils_composeRefs.useComposedRefs(forwardRef, footerRef);
11
14
  const classes = clsx(
12
15
  [components_flipCard_flipCardRoot.styles[`${components_flipCard_flipCardRoot.rootClassName}__footer`]],
13
16
  {
@@ -15,7 +18,7 @@ const Footer = React.forwardRef(
15
18
  },
16
19
  className
17
20
  );
18
- return /* @__PURE__ */ jsxRuntime.jsx("div", { ...props, ref: forwardRef, className: classes, children });
21
+ return /* @__PURE__ */ jsxRuntime.jsx("div", { ...props, ref: composedRef, className: classes, children });
19
22
  }
20
23
  );
21
24
  Footer.displayName = "Footer";
package/dist/components/flip-card/flip-card-footer.js CHANGED
@@ -1,11 +1,14 @@
1
1
  import { jsx } from "react/jsx-runtime";
2
2
  import React__default, { useContext } from "react";
3
3
  import clsx from "clsx";
4
- import { s as styles, rootClassName } from "./flip-card-root.js";
4
+ import { FlipContext, s as styles, rootClassName } from "./flip-card-root.js";
5
5
  import { BackContext } from "./flip-card-back.js";
6
+ import { useComposedRefs } from "../../utils/composeRefs.js";
6
7
  const Footer = React__default.forwardRef(
7
8
  ({ className, children, ...props }, forwardRef) => {
8
9
  const { variant: backVariant } = useContext(BackContext);
10
+ const { footerRef } = useContext(FlipContext);
11
+ const composedRef = useComposedRefs(forwardRef, footerRef);
9
12
  const classes = clsx(
10
13
  [styles[`${rootClassName}__footer`]],
11
14
  {
@@ -13,7 +16,7 @@ const Footer = React__default.forwardRef(
13
16
  },
14
17
  className
15
18
  );
16
- return /* @__PURE__ */ jsx("div", { ...props, ref: forwardRef, className: classes, children });
19
+ return /* @__PURE__ */ jsx("div", { ...props, ref: composedRef, className: classes, children });
17
20
  }
18
21
  );
19
22
  Footer.displayName = "Footer";
package/dist/components/flip-card/flip-card-root.cjs CHANGED
@@ -6,19 +6,19 @@ const clsx = require("clsx");
6
6
  const reactUseControllableState = require("@radix-ui/react-use-controllable-state");
7
7
  const utils_composeRefs = require("../../utils/composeRefs.cjs");
8
8
  const styles = {
9
- "teddy-flip-card": "_teddy-flip-card_1is05_1",
10
- "teddy-flip-card--flipped": "_teddy-flip-card--flipped_1is05_12",
11
- "teddy-flip-card__front": "_teddy-flip-card__front_1is05_15",
12
- "teddy-flip-card__back": "_teddy-flip-card__back_1is05_19",
13
- "teddy-flip-card__back-inner": "_teddy-flip-card__back-inner_1is05_31",
14
- "teddy-flip-card__scroll-area-view-port": "_teddy-flip-card__scroll-area-view-port_1is05_38",
15
- "teddy-flip-card__footer": "_teddy-flip-card__footer_1is05_42",
16
- "teddy-flip-card__footer--purple-light": "_teddy-flip-card__footer--purple-light_1is05_50",
17
- "teddy-flip-card__footer--purple-dark": "_teddy-flip-card__footer--purple-dark_1is05_53",
18
- "teddy-flip-card__footer--beige": "_teddy-flip-card__footer--beige_1is05_56",
19
- "teddy-flip-card__footer--beige-light": "_teddy-flip-card__footer--beige-light_1is05_59",
20
- "teddy-flip-card__footer--gray": "_teddy-flip-card__footer--gray_1is05_62",
21
- "teddy-flip-card__footer--white": "_teddy-flip-card__footer--white_1is05_65"
9
+ "teddy-flip-card": "_teddy-flip-card_i5s05_1",
10
+ "teddy-flip-card--flipped": "_teddy-flip-card--flipped_i5s05_12",
11
+ "teddy-flip-card__front": "_teddy-flip-card__front_i5s05_15",
12
+ "teddy-flip-card__back": "_teddy-flip-card__back_i5s05_19",
13
+ "teddy-flip-card__back-inner": "_teddy-flip-card__back-inner_i5s05_33",
14
+ "teddy-flip-card__scroll-area-view-port": "_teddy-flip-card__scroll-area-view-port_i5s05_41",
15
+ "teddy-flip-card__footer": "_teddy-flip-card__footer_i5s05_45",
16
+ "teddy-flip-card__footer--purple-light": "_teddy-flip-card__footer--purple-light_i5s05_52",
17
+ "teddy-flip-card__footer--purple-dark": "_teddy-flip-card__footer--purple-dark_i5s05_55",
18
+ "teddy-flip-card__footer--beige": "_teddy-flip-card__footer--beige_i5s05_58",
19
+ "teddy-flip-card__footer--beige-light": "_teddy-flip-card__footer--beige-light_i5s05_61",
20
+ "teddy-flip-card__footer--gray": "_teddy-flip-card__footer--gray_i5s05_64",
21
+ "teddy-flip-card__footer--white": "_teddy-flip-card__footer--white_i5s05_67"
22
22
  };
23
23
  const rootClassName = "teddy-flip-card";
24
24
  const FlipContext = React.createContext({
@@ -27,7 +27,8 @@ const FlipContext = React.createContext({
27
27
  frontId: "",
28
28
  backId: "",
29
29
  frontRef: void 0,
30
- backRef: void 0
30
+ backRef: void 0,
31
+ footerRef: void 0
31
32
  });
32
33
  const FALLBACK_ANIMATION_DURATION = 500;
33
34
  function parseTimeToMs(time) {
@@ -58,6 +59,7 @@ const Root = React.forwardRef(
58
59
  const composedRef = utils_composeRefs.useComposedRefs(forwardRef, internalRef);
59
60
  const frontRef = React.useRef(null);
60
61
  const backRef = React.useRef(null);
62
+ const footerRef = React.useRef(null);
61
63
  const timerRef = React.useRef();
62
64
  const [animationDuration, setAnimationDuration] = React.useState(FALLBACK_ANIMATION_DURATION);
63
65
  const uniqueId = id || `flip-card-${Math.random().toString(36).substring(2, 9)}`;
@@ -110,7 +112,7 @@ const Root = React.forwardRef(
110
112
  }
111
113
  };
112
114
  }, []);
113
- return /* @__PURE__ */ jsxRuntime.jsx(FlipContext.Provider, { value: { flipped, setFlipped, frontId, backId, frontRef, backRef }, children: /* @__PURE__ */ jsxRuntime.jsx(
115
+ return /* @__PURE__ */ jsxRuntime.jsx(FlipContext.Provider, { value: { flipped, setFlipped, frontId, backId, frontRef, backRef, footerRef }, children: /* @__PURE__ */ jsxRuntime.jsx(
114
116
  "div",
115
117
  {
116
118
  ...props,
package/dist/components/flip-card/flip-card-root.d.ts CHANGED
@@ -8,6 +8,7 @@ export type FlipContextType = {
8
8
  backId: string;
9
9
  frontRef: React.RefObject<HTMLDivElement> | undefined;
10
10
  backRef: React.RefObject<HTMLDivElement> | undefined;
11
+ footerRef: React.RefObject<HTMLDivElement> | undefined;
11
12
  };
12
13
  export declare const FlipContext: React.Context<FlipContextType>;
13
14
  export type RootProps = React.ComponentPropsWithoutRef<'div'> & {
package/dist/components/flip-card/flip-card-root.js CHANGED
@@ -4,19 +4,19 @@ import clsx from "clsx";
4
4
  import { useControllableState } from "@radix-ui/react-use-controllable-state";
5
5
  import { useComposedRefs } from "../../utils/composeRefs.js";
6
6
  const styles = {
7
- "teddy-flip-card": "_teddy-flip-card_1is05_1",
8
- "teddy-flip-card--flipped": "_teddy-flip-card--flipped_1is05_12",
9
- "teddy-flip-card__front": "_teddy-flip-card__front_1is05_15",
10
- "teddy-flip-card__back": "_teddy-flip-card__back_1is05_19",
11
- "teddy-flip-card__back-inner": "_teddy-flip-card__back-inner_1is05_31",
12
- "teddy-flip-card__scroll-area-view-port": "_teddy-flip-card__scroll-area-view-port_1is05_38",
13
- "teddy-flip-card__footer": "_teddy-flip-card__footer_1is05_42",
14
- "teddy-flip-card__footer--purple-light": "_teddy-flip-card__footer--purple-light_1is05_50",
15
- "teddy-flip-card__footer--purple-dark": "_teddy-flip-card__footer--purple-dark_1is05_53",
16
- "teddy-flip-card__footer--beige": "_teddy-flip-card__footer--beige_1is05_56",
17
- "teddy-flip-card__footer--beige-light": "_teddy-flip-card__footer--beige-light_1is05_59",
18
- "teddy-flip-card__footer--gray": "_teddy-flip-card__footer--gray_1is05_62",
19
- "teddy-flip-card__footer--white": "_teddy-flip-card__footer--white_1is05_65"
7
+ "teddy-flip-card": "_teddy-flip-card_i5s05_1",
8
+ "teddy-flip-card--flipped": "_teddy-flip-card--flipped_i5s05_12",
9
+ "teddy-flip-card__front": "_teddy-flip-card__front_i5s05_15",
10
+ "teddy-flip-card__back": "_teddy-flip-card__back_i5s05_19",
11
+ "teddy-flip-card__back-inner": "_teddy-flip-card__back-inner_i5s05_33",
12
+ "teddy-flip-card__scroll-area-view-port": "_teddy-flip-card__scroll-area-view-port_i5s05_41",
13
+ "teddy-flip-card__footer": "_teddy-flip-card__footer_i5s05_45",
14
+ "teddy-flip-card__footer--purple-light": "_teddy-flip-card__footer--purple-light_i5s05_52",
15
+ "teddy-flip-card__footer--purple-dark": "_teddy-flip-card__footer--purple-dark_i5s05_55",
16
+ "teddy-flip-card__footer--beige": "_teddy-flip-card__footer--beige_i5s05_58",
17
+ "teddy-flip-card__footer--beige-light": "_teddy-flip-card__footer--beige-light_i5s05_61",
18
+ "teddy-flip-card__footer--gray": "_teddy-flip-card__footer--gray_i5s05_64",
19
+ "teddy-flip-card__footer--white": "_teddy-flip-card__footer--white_i5s05_67"
20
20
  };
21
21
  const rootClassName = "teddy-flip-card";
22
22
  const FlipContext = createContext({
@@ -25,7 +25,8 @@ const FlipContext = createContext({
25
25
  frontId: "",
26
26
  backId: "",
27
27
  frontRef: void 0,
28
- backRef: void 0
28
+ backRef: void 0,
29
+ footerRef: void 0
29
30
  });
30
31
  const FALLBACK_ANIMATION_DURATION = 500;
31
32
  function parseTimeToMs(time) {
@@ -56,6 +57,7 @@ const Root = React__default.forwardRef(
56
57
  const composedRef = useComposedRefs(forwardRef, internalRef);
57
58
  const frontRef = useRef(null);
58
59
  const backRef = useRef(null);
60
+ const footerRef = useRef(null);
59
61
  const timerRef = useRef();
60
62
  const [animationDuration, setAnimationDuration] = useState(FALLBACK_ANIMATION_DURATION);
61
63
  const uniqueId = id || `flip-card-${Math.random().toString(36).substring(2, 9)}`;
@@ -108,7 +110,7 @@ const Root = React__default.forwardRef(
108
110
  }
109
111
  };
110
112
  }, []);
111
- return /* @__PURE__ */ jsx(FlipContext.Provider, { value: { flipped, setFlipped, frontId, backId, frontRef, backRef }, children: /* @__PURE__ */ jsx(
113
+ return /* @__PURE__ */ jsx(FlipContext.Provider, { value: { flipped, setFlipped, frontId, backId, frontRef, backRef, footerRef }, children: /* @__PURE__ */ jsx(
112
114
  "div",
113
115
  {
114
116
  ...props,
package/dist/style.css CHANGED
@@ -1,22 +1,22 @@
1
- @charset 'UTF-8';._teddy-flip-card_1is05_1 {
1
+ @charset 'UTF-8';._teddy-flip-card_i5s05_1 {
2
2
  position: relative;
3
3
  perspective: 1000px;
4
4
  transform-style: preserve-3d;
5
5
  z-index: 0;
6
6
  }
7
7
  @media (prefers-reduced-motion: no-preference) {
8
- ._teddy-flip-card_1is05_1 {
8
+ ._teddy-flip-card_i5s05_1 {
9
9
  transition: transform var(--teddy-motion-duration-500) var(--teddy-motion-easing-ease-in-out);
10
10
  }
11
11
  }
12
- ._teddy-flip-card--flipped_1is05_12 {
12
+ ._teddy-flip-card--flipped_i5s05_12 {
13
13
  transform: rotateY(180deg);
14
14
  }
15
- ._teddy-flip-card__front_1is05_15 {
15
+ ._teddy-flip-card__front_i5s05_15 {
16
16
  backface-visibility: hidden;
17
17
  z-index: 2;
18
18
  }
19
- ._teddy-flip-card__back_1is05_19 {
19
+ ._teddy-flip-card__back_i5s05_19 {
20
20
  position: absolute;
21
21
  top: 0;
22
22
  left: 0;
@@ -24,45 +24,47 @@
24
24
  height: 100%;
25
25
  backface-visibility: hidden;
26
26
  transform: rotateY(180deg);
27
- display: flex;
28
- flex-direction: column;
27
+ display: grid;
28
+ justify-content: normal;
29
+ align-content: stretch;
29
30
  padding: 0;
31
+ overflow: hidden;
30
32
  }
31
- ._teddy-flip-card__back-inner_1is05_31 {
33
+ ._teddy-flip-card__back-inner_i5s05_33 {
32
34
  padding: 0;
33
35
  margin: 0;
34
36
  width: 100%;
35
37
  height: 100%;
36
38
  justify-content: stretch;
39
+ position: initial;
37
40
  }
38
- ._teddy-flip-card__scroll-area-view-port_1is05_38 {
41
+ ._teddy-flip-card__scroll-area-view-port_i5s05_41 {
39
42
  padding: var(--teddy-spacing-250) var(--teddy-spacing-250) 0 var(--teddy-spacing-250);
40
43
  margin-bottom: var(--teddy-spacing-250);
41
44
  }
42
- ._teddy-flip-card__footer_1is05_42 {
43
- position: sticky;
45
+ ._teddy-flip-card__footer_i5s05_45 {
46
+ position: absolute;
44
47
  inset: auto 0 0 0;
45
48
  padding: var(--teddy-spacing-50);
46
49
  border-top: var(--teddy-border-width-xs) solid var(--teddy-color-border-weak);
47
- margin: 0 calc(-1 * var(--teddy-spacing-250));
48
50
  border-radius: 0 0 var(--teddy-border-radius-md) var(--teddy-border-radius-md);
49
51
  }
50
- ._teddy-flip-card__footer--purple-light_1is05_50 {
52
+ ._teddy-flip-card__footer--purple-light_i5s05_52 {
51
53
  background-color: var(--teddy-color-background-interactive-primary-negative);
52
54
  }
53
- ._teddy-flip-card__footer--purple-dark_1is05_53 {
55
+ ._teddy-flip-card__footer--purple-dark_i5s05_55 {
54
56
  background-color: var(--teddy-color-brand-deep-purple);
55
57
  }
56
- ._teddy-flip-card__footer--beige_1is05_56 {
58
+ ._teddy-flip-card__footer--beige_i5s05_58 {
57
59
  background-color: var(--teddy-color-background-interactive-primary);
58
60
  }
59
- ._teddy-flip-card__footer--beige-light_1is05_59 {
61
+ ._teddy-flip-card__footer--beige-light_i5s05_61 {
60
62
  background-color: var(--teddy-color-background-interactive-primary-negative);
61
63
  }
62
- ._teddy-flip-card__footer--gray_1is05_62 {
64
+ ._teddy-flip-card__footer--gray_i5s05_64 {
63
65
  background-color: var(--teddy-color-background-secondary);
64
66
  }
65
- ._teddy-flip-card__footer--white_1is05_65 {
67
+ ._teddy-flip-card__footer--white_i5s05_67 {
66
68
  background-color: var(--teddy-color-brand-white);
67
69
  }@layer grid {
68
70
  ._teddy-grid_1dv1t_2 {
package/package.json CHANGED
@@ -20,7 +20,7 @@
20
20
  "pnpm": ">=9"
21
21
  },
22
22
  "private": false,
23
- "version": "0.4.8",
23
+ "version": "0.4.9",
24
24
  "sideEffects": [
25
25
  "**/*.css",
26
26
  "**/*.svg"