@telia/teddy 0.7.55 → 0.7.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.
- package/dist/components/checkbox-card-group/checkbox-card-group-indicator.cjs +1 -1
- package/dist/components/checkbox-card-group/checkbox-card-group-indicator.js +1 -1
- package/dist/components/modal/modal-close.cjs +1 -1
- package/dist/components/modal/modal-close.js +1 -1
- package/dist/components/modal/modal-content.cjs +7 -3
- package/dist/components/modal/modal-content.d.ts +2 -0
- package/dist/components/modal/modal-content.js +7 -3
- package/dist/components/modal/modal-group.cjs +1 -1
- package/dist/components/modal/modal-group.js +1 -1
- package/dist/components/modal/modal-image.cjs +1 -1
- package/dist/components/modal/modal-image.js +1 -1
- package/dist/components/modal/modal-overlay.cjs +1 -1
- package/dist/components/modal/modal-overlay.js +1 -1
- package/dist/modal.module-BiWUSJ-j.cjs +23 -0
- package/dist/modal.module-Cr1ceNDO.js +24 -0
- package/dist/style.css +39 -35
- package/package.json +1 -1
- package/dist/modal.module-1dzCSzkb.js +0 -23
- package/dist/modal.module-DC_f9KzI.cjs +0 -22
|
@@ -86,7 +86,7 @@ require("../container/container.cjs");
|
|
|
86
86
|
require("../carousel/carousel-root.cjs");
|
|
87
87
|
require("../slider/slider.cjs");
|
|
88
88
|
require("../textarea/index.cjs");
|
|
89
|
-
const modal_module = require("../../modal.module-
|
|
89
|
+
const modal_module = require("../../modal.module-BiWUSJ-j.cjs");
|
|
90
90
|
const components_modal_modalImage = require("../modal/modal-image.cjs");
|
|
91
91
|
const components_radioCardGroup_radioCardGroupIndicator = require("../radio-card-group/radio-card-group-indicator.cjs");
|
|
92
92
|
const components_radioCardGroup_radioCardGroupItemBody = require("../radio-card-group/radio-card-group-item-body.cjs");
|
|
@@ -84,7 +84,7 @@ import "../container/container.js";
|
|
|
84
84
|
import "../carousel/carousel-root.js";
|
|
85
85
|
import "../slider/slider.js";
|
|
86
86
|
import "../textarea/index.js";
|
|
87
|
-
import { s as styles$4 } from "../../modal.module-
|
|
87
|
+
import { s as styles$4 } from "../../modal.module-Cr1ceNDO.js";
|
|
88
88
|
import { Image } from "../modal/modal-image.js";
|
|
89
89
|
import { Indicator as Indicator$2 } from "../radio-card-group/radio-card-group-indicator.js";
|
|
90
90
|
import { Body as Body$1 } from "../radio-card-group/radio-card-group-item-body.js";
|
|
@@ -68,6 +68,6 @@ require("../container/container.cjs");
|
|
|
68
68
|
require("../carousel/carousel-root.cjs");
|
|
69
69
|
require("../slider/slider.cjs");
|
|
70
70
|
require("../textarea/index.cjs");
|
|
71
|
-
require("../../modal.module-
|
|
71
|
+
require("../../modal.module-BiWUSJ-j.cjs");
|
|
72
72
|
require("./modal-root.cjs");
|
|
73
73
|
exports.Close = components_checkboxCardGroup_checkboxCardGroupIndicator.Close$1;
|
|
@@ -66,7 +66,7 @@ import "../container/container.js";
|
|
|
66
66
|
import "../carousel/carousel-root.js";
|
|
67
67
|
import "../slider/slider.js";
|
|
68
68
|
import "../textarea/index.js";
|
|
69
|
-
import "../../modal.module-
|
|
69
|
+
import "../../modal.module-Cr1ceNDO.js";
|
|
70
70
|
import "./modal-root.js";
|
|
71
71
|
export {
|
|
72
72
|
g as Close
|
|
@@ -5,7 +5,7 @@ const React = require("react");
|
|
|
5
5
|
const DrawerPrimitive = require("@radix-ui/react-dialog");
|
|
6
6
|
const components_flex_flex = require("../flex/flex.cjs");
|
|
7
7
|
const clsx = require("clsx");
|
|
8
|
-
const modal_module = require("../../modal.module-
|
|
8
|
+
const modal_module = require("../../modal.module-BiWUSJ-j.cjs");
|
|
9
9
|
const components_modal_modalRoot = require("./modal-root.cjs");
|
|
10
10
|
const components_modal_modalOverlay = require("./modal-overlay.cjs");
|
|
11
11
|
function _interopNamespaceDefault(e) {
|
|
@@ -26,7 +26,7 @@ function _interopNamespaceDefault(e) {
|
|
|
26
26
|
}
|
|
27
27
|
const DrawerPrimitive__namespace = /* @__PURE__ */ _interopNamespaceDefault(DrawerPrimitive);
|
|
28
28
|
const InnerContent = React.forwardRef(
|
|
29
|
-
function InnerContent2({ asChild, children, className, size, ...props }, forwardedRef) {
|
|
29
|
+
function InnerContent2({ asChild, children, className, size, useRoundedCorners, ...props }, forwardedRef) {
|
|
30
30
|
const classes = clsx([modal_module.styles[`${components_modal_modalRoot.rootClassName}__scroll`]], className);
|
|
31
31
|
const context = React.useContext(components_modal_modalRoot.RootContext);
|
|
32
32
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
@@ -34,7 +34,11 @@ const InnerContent = React.forwardRef(
|
|
|
34
34
|
{
|
|
35
35
|
...props,
|
|
36
36
|
ref: forwardedRef,
|
|
37
|
-
className: clsx([
|
|
37
|
+
className: clsx([
|
|
38
|
+
modal_module.styles[`${components_modal_modalRoot.rootClassName}__content`],
|
|
39
|
+
size && modal_module.styles[`${components_modal_modalRoot.rootClassName}__content--${size}`],
|
|
40
|
+
useRoundedCorners && modal_module.styles[`${components_modal_modalRoot.rootClassName}__content--rounded`]
|
|
41
|
+
]),
|
|
38
42
|
asChild: true,
|
|
39
43
|
children: /* @__PURE__ */ jsxRuntime.jsx(components_flex_flex.Flex, { children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
40
44
|
components_flex_flex.Flex,
|
|
@@ -4,9 +4,11 @@ import * as DialogPrimitive from '@radix-ui/react-dialog';
|
|
|
4
4
|
type Size = 'sm' | 'md' | 'lg';
|
|
5
5
|
type ContentProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Content> & {
|
|
6
6
|
size?: Size;
|
|
7
|
+
useRoundedCorners?: boolean;
|
|
7
8
|
};
|
|
8
9
|
declare const Content: React.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
|
|
9
10
|
size?: Size;
|
|
11
|
+
useRoundedCorners?: boolean;
|
|
10
12
|
} & React.RefAttributes<HTMLDivElement>>;
|
|
11
13
|
export { Content };
|
|
12
14
|
export type { ContentProps };
|
|
@@ -3,11 +3,11 @@ import React__default from "react";
|
|
|
3
3
|
import * as DrawerPrimitive from "@radix-ui/react-dialog";
|
|
4
4
|
import { Flex } from "../flex/flex.js";
|
|
5
5
|
import clsx from "clsx";
|
|
6
|
-
import { s as styles } from "../../modal.module-
|
|
6
|
+
import { s as styles } from "../../modal.module-Cr1ceNDO.js";
|
|
7
7
|
import { rootClassName, RootContext } from "./modal-root.js";
|
|
8
8
|
import { OverlayContext, Overlay } from "./modal-overlay.js";
|
|
9
9
|
const InnerContent = React__default.forwardRef(
|
|
10
|
-
function InnerContent2({ asChild, children, className, size, ...props }, forwardedRef) {
|
|
10
|
+
function InnerContent2({ asChild, children, className, size, useRoundedCorners, ...props }, forwardedRef) {
|
|
11
11
|
const classes = clsx([styles[`${rootClassName}__scroll`]], className);
|
|
12
12
|
const context = React__default.useContext(RootContext);
|
|
13
13
|
return /* @__PURE__ */ jsx(
|
|
@@ -15,7 +15,11 @@ const InnerContent = React__default.forwardRef(
|
|
|
15
15
|
{
|
|
16
16
|
...props,
|
|
17
17
|
ref: forwardedRef,
|
|
18
|
-
className: clsx([
|
|
18
|
+
className: clsx([
|
|
19
|
+
styles[`${rootClassName}__content`],
|
|
20
|
+
size && styles[`${rootClassName}__content--${size}`],
|
|
21
|
+
useRoundedCorners && styles[`${rootClassName}__content--rounded`]
|
|
22
|
+
]),
|
|
19
23
|
asChild: true,
|
|
20
24
|
children: /* @__PURE__ */ jsx(Flex, { children: /* @__PURE__ */ jsx(
|
|
21
25
|
Flex,
|
|
@@ -4,7 +4,7 @@ const jsxRuntime = require("react/jsx-runtime");
|
|
|
4
4
|
const React = require("react");
|
|
5
5
|
const components_flex_flex = require("../flex/flex.cjs");
|
|
6
6
|
const clsx = require("clsx");
|
|
7
|
-
const modal_module = require("../../modal.module-
|
|
7
|
+
const modal_module = require("../../modal.module-BiWUSJ-j.cjs");
|
|
8
8
|
const components_modal_modalRoot = require("./modal-root.cjs");
|
|
9
9
|
const GroupContext = React.createContext(false);
|
|
10
10
|
const Group = React.forwardRef(
|
|
@@ -2,7 +2,7 @@ import { jsx } from "react/jsx-runtime";
|
|
|
2
2
|
import React__default, { useEffect } from "react";
|
|
3
3
|
import { Flex } from "../flex/flex.js";
|
|
4
4
|
import clsx from "clsx";
|
|
5
|
-
import { s as styles } from "../../modal.module-
|
|
5
|
+
import { s as styles } from "../../modal.module-Cr1ceNDO.js";
|
|
6
6
|
import { RootContext, rootClassName } from "./modal-root.js";
|
|
7
7
|
const GroupContext = React__default.createContext(false);
|
|
8
8
|
const Group = React__default.forwardRef(
|
|
@@ -3,7 +3,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
|
3
3
|
const jsxRuntime = require("react/jsx-runtime");
|
|
4
4
|
const React = require("react");
|
|
5
5
|
const clsx = require("clsx");
|
|
6
|
-
const modal_module = require("../../modal.module-
|
|
6
|
+
const modal_module = require("../../modal.module-BiWUSJ-j.cjs");
|
|
7
7
|
const reactSlot = require("@radix-ui/react-slot");
|
|
8
8
|
const utils_composeRefs = require("../../utils/composeRefs.cjs");
|
|
9
9
|
const components_modal_modalRoot = require("./modal-root.cjs");
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { jsx } from "react/jsx-runtime";
|
|
2
2
|
import React__default from "react";
|
|
3
3
|
import clsx from "clsx";
|
|
4
|
-
import { s as styles } from "../../modal.module-
|
|
4
|
+
import { s as styles } from "../../modal.module-Cr1ceNDO.js";
|
|
5
5
|
import { Slot } from "@radix-ui/react-slot";
|
|
6
6
|
import { composeRefs } from "../../utils/composeRefs.js";
|
|
7
7
|
import { rootClassName, RootContext } from "./modal-root.js";
|
|
@@ -4,7 +4,7 @@ const jsxRuntime = require("react/jsx-runtime");
|
|
|
4
4
|
const React = require("react");
|
|
5
5
|
const DrawerPrimitive = require("@radix-ui/react-dialog");
|
|
6
6
|
const clsx = require("clsx");
|
|
7
|
-
const modal_module = require("../../modal.module-
|
|
7
|
+
const modal_module = require("../../modal.module-BiWUSJ-j.cjs");
|
|
8
8
|
const components_modal_modalRoot = require("./modal-root.cjs");
|
|
9
9
|
function _interopNamespaceDefault(e) {
|
|
10
10
|
const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
|
|
@@ -2,7 +2,7 @@ import { jsx } from "react/jsx-runtime";
|
|
|
2
2
|
import React__default from "react";
|
|
3
3
|
import * as DrawerPrimitive from "@radix-ui/react-dialog";
|
|
4
4
|
import clsx from "clsx";
|
|
5
|
-
import { s as styles } from "../../modal.module-
|
|
5
|
+
import { s as styles } from "../../modal.module-Cr1ceNDO.js";
|
|
6
6
|
import { rootClassName } from "./modal-root.js";
|
|
7
7
|
const OverlayContext = React__default.createContext(false);
|
|
8
8
|
const Overlay = React__default.forwardRef(
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
const styles = {
|
|
3
|
+
"teddy-modal__overlay": "_teddy-modal__overlay_h9ov2_25",
|
|
4
|
+
"teddy-modal__content": "_teddy-modal__content_h9ov2_37",
|
|
5
|
+
"teddy-modal__content--rounded": "_teddy-modal__content--rounded_h9ov2_45",
|
|
6
|
+
"teddy-modal__content--sm": "_teddy-modal__content--sm_h9ov2_60",
|
|
7
|
+
"teddy-modal__content--md": "_teddy-modal__content--md_h9ov2_65",
|
|
8
|
+
"teddy-modal__content--lg": "_teddy-modal__content--lg_h9ov2_70",
|
|
9
|
+
"teddy-modal__scroll": "_teddy-modal__scroll_h9ov2_74",
|
|
10
|
+
"teddy-modal__image": "_teddy-modal__image_h9ov2_78",
|
|
11
|
+
"teddy-modal__close--floating": "_teddy-modal__close--floating_h9ov2_88",
|
|
12
|
+
"teddy-modal__group": "_teddy-modal__group_h9ov2_98",
|
|
13
|
+
"teddy-modal__group--title": "_teddy-modal__group--title_h9ov2_102",
|
|
14
|
+
"teddy-modal__group--scroll": "_teddy-modal__group--scroll_h9ov2_113",
|
|
15
|
+
"teddy-modal__group--action": "_teddy-modal__group--action_h9ov2_122",
|
|
16
|
+
"modal-overlay-no-op": "_modal-overlay-no-op_h9ov2_1",
|
|
17
|
+
"teddy-fade-in": "_teddy-fade-in_h9ov2_1",
|
|
18
|
+
"teddy-fade-out": "_teddy-fade-out_h9ov2_1",
|
|
19
|
+
"modal-content-show": "_modal-content-show_h9ov2_1",
|
|
20
|
+
"modal-content-hide": "_modal-content-hide_h9ov2_1",
|
|
21
|
+
"teddy-overlay-no-op": "_teddy-overlay-no-op_h9ov2_1"
|
|
22
|
+
};
|
|
23
|
+
exports.styles = styles;
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
const styles = {
|
|
2
|
+
"teddy-modal__overlay": "_teddy-modal__overlay_h9ov2_25",
|
|
3
|
+
"teddy-modal__content": "_teddy-modal__content_h9ov2_37",
|
|
4
|
+
"teddy-modal__content--rounded": "_teddy-modal__content--rounded_h9ov2_45",
|
|
5
|
+
"teddy-modal__content--sm": "_teddy-modal__content--sm_h9ov2_60",
|
|
6
|
+
"teddy-modal__content--md": "_teddy-modal__content--md_h9ov2_65",
|
|
7
|
+
"teddy-modal__content--lg": "_teddy-modal__content--lg_h9ov2_70",
|
|
8
|
+
"teddy-modal__scroll": "_teddy-modal__scroll_h9ov2_74",
|
|
9
|
+
"teddy-modal__image": "_teddy-modal__image_h9ov2_78",
|
|
10
|
+
"teddy-modal__close--floating": "_teddy-modal__close--floating_h9ov2_88",
|
|
11
|
+
"teddy-modal__group": "_teddy-modal__group_h9ov2_98",
|
|
12
|
+
"teddy-modal__group--title": "_teddy-modal__group--title_h9ov2_102",
|
|
13
|
+
"teddy-modal__group--scroll": "_teddy-modal__group--scroll_h9ov2_113",
|
|
14
|
+
"teddy-modal__group--action": "_teddy-modal__group--action_h9ov2_122",
|
|
15
|
+
"modal-overlay-no-op": "_modal-overlay-no-op_h9ov2_1",
|
|
16
|
+
"teddy-fade-in": "_teddy-fade-in_h9ov2_1",
|
|
17
|
+
"teddy-fade-out": "_teddy-fade-out_h9ov2_1",
|
|
18
|
+
"modal-content-show": "_modal-content-show_h9ov2_1",
|
|
19
|
+
"modal-content-hide": "_modal-content-hide_h9ov2_1",
|
|
20
|
+
"teddy-overlay-no-op": "_teddy-overlay-no-op_h9ov2_1"
|
|
21
|
+
};
|
|
22
|
+
export {
|
|
23
|
+
styles as s
|
|
24
|
+
};
|
package/dist/style.css
CHANGED
|
@@ -6042,7 +6042,7 @@
|
|
|
6042
6042
|
}
|
|
6043
6043
|
._teddy-chip__indicator_lsr0j_83 {
|
|
6044
6044
|
display: none;
|
|
6045
|
-
}@keyframes _teddy-fade-
|
|
6045
|
+
}@keyframes _teddy-fade-in_h9ov2_1 {
|
|
6046
6046
|
from {
|
|
6047
6047
|
opacity: 0;
|
|
6048
6048
|
}
|
|
@@ -6050,7 +6050,7 @@
|
|
|
6050
6050
|
opacity: 1;
|
|
6051
6051
|
}
|
|
6052
6052
|
}
|
|
6053
|
-
@keyframes _teddy-fade-
|
|
6053
|
+
@keyframes _teddy-fade-out_h9ov2_1 {
|
|
6054
6054
|
from {
|
|
6055
6055
|
opacity: 1;
|
|
6056
6056
|
}
|
|
@@ -6058,7 +6058,7 @@
|
|
|
6058
6058
|
opacity: 0;
|
|
6059
6059
|
}
|
|
6060
6060
|
}
|
|
6061
|
-
@keyframes _teddy-overlay-no-
|
|
6061
|
+
@keyframes _teddy-overlay-no-op_h9ov2_1 {
|
|
6062
6062
|
from {
|
|
6063
6063
|
opacity: 1;
|
|
6064
6064
|
}
|
|
@@ -6066,19 +6066,19 @@
|
|
|
6066
6066
|
opacity: 1;
|
|
6067
6067
|
}
|
|
6068
6068
|
}
|
|
6069
|
-
._teddy-
|
|
6069
|
+
._teddy-modal__overlay_h9ov2_25 {
|
|
6070
6070
|
position: fixed;
|
|
6071
6071
|
inset: 0;
|
|
6072
6072
|
display: grid;
|
|
6073
6073
|
place-items: center;
|
|
6074
6074
|
}
|
|
6075
|
-
._teddy-
|
|
6075
|
+
._teddy-modal__overlay_h9ov2_25::before {
|
|
6076
6076
|
position: fixed;
|
|
6077
6077
|
content: "";
|
|
6078
6078
|
inset: 0;
|
|
6079
6079
|
background-color: var(--teddy-color-overlay-default);
|
|
6080
6080
|
}
|
|
6081
|
-
._teddy-
|
|
6081
|
+
._teddy-modal__content_h9ov2_37 {
|
|
6082
6082
|
background-color: var(--teddy-color-background-primary);
|
|
6083
6083
|
box-shadow: var(--teddy-shadow-lg);
|
|
6084
6084
|
position: relative;
|
|
@@ -6086,8 +6086,12 @@
|
|
|
6086
6086
|
height: 100%;
|
|
6087
6087
|
width: 100%;
|
|
6088
6088
|
}
|
|
6089
|
+
._teddy-modal__content--rounded_h9ov2_45 {
|
|
6090
|
+
border-top-left-radius: 1rem;
|
|
6091
|
+
border-top-right-radius: 1rem;
|
|
6092
|
+
}
|
|
6089
6093
|
@media (min-width: 600px) {
|
|
6090
|
-
._teddy-
|
|
6094
|
+
._teddy-modal__content_h9ov2_37 {
|
|
6091
6095
|
max-width: 720px;
|
|
6092
6096
|
max-height: 80%;
|
|
6093
6097
|
min-height: 360px;
|
|
@@ -6097,25 +6101,25 @@
|
|
|
6097
6101
|
}
|
|
6098
6102
|
}
|
|
6099
6103
|
@media (min-width: 600px) {
|
|
6100
|
-
._teddy-modal__content--
|
|
6104
|
+
._teddy-modal__content--sm_h9ov2_60 {
|
|
6101
6105
|
max-width: 480px;
|
|
6102
6106
|
}
|
|
6103
6107
|
}
|
|
6104
6108
|
@media (min-width: 600px) {
|
|
6105
|
-
._teddy-modal__content--
|
|
6109
|
+
._teddy-modal__content--md_h9ov2_65 {
|
|
6106
6110
|
max-width: 720px;
|
|
6107
6111
|
}
|
|
6108
6112
|
}
|
|
6109
6113
|
@media (min-width: 600px) {
|
|
6110
|
-
._teddy-modal__content--
|
|
6114
|
+
._teddy-modal__content--lg_h9ov2_70 {
|
|
6111
6115
|
max-width: 1000px;
|
|
6112
6116
|
}
|
|
6113
6117
|
}
|
|
6114
|
-
._teddy-
|
|
6118
|
+
._teddy-modal__scroll_h9ov2_74 {
|
|
6115
6119
|
overflow: auto;
|
|
6116
6120
|
padding-inline: var(--teddy-spacing-300);
|
|
6117
6121
|
}
|
|
6118
|
-
._teddy-
|
|
6122
|
+
._teddy-modal__image_h9ov2_78 {
|
|
6119
6123
|
max-width: calc(100% + var(--teddy-spacing-300) * 2);
|
|
6120
6124
|
height: auto;
|
|
6121
6125
|
vertical-align: middle;
|
|
@@ -6125,41 +6129,41 @@
|
|
|
6125
6129
|
shape-margin: 0.75rem;
|
|
6126
6130
|
margin-inline: calc(var(--teddy-spacing-300) * -1);
|
|
6127
6131
|
}
|
|
6128
|
-
._teddy-modal__close--
|
|
6132
|
+
._teddy-modal__close--floating_h9ov2_88 {
|
|
6129
6133
|
position: absolute;
|
|
6130
6134
|
top: var(--teddy-spacing-100);
|
|
6131
6135
|
right: var(--teddy-spacing-100);
|
|
6132
6136
|
}
|
|
6133
6137
|
@media (max-width: 600px) {
|
|
6134
|
-
._teddy-modal__close--
|
|
6138
|
+
._teddy-modal__close--floating_h9ov2_88 {
|
|
6135
6139
|
top: var(--teddy-spacing-50);
|
|
6136
6140
|
}
|
|
6137
6141
|
}
|
|
6138
|
-
._teddy-
|
|
6142
|
+
._teddy-modal__group_h9ov2_98 {
|
|
6139
6143
|
width: 100%;
|
|
6140
6144
|
margin-bottom: var(--teddy-spacing-200);
|
|
6141
6145
|
}
|
|
6142
|
-
._teddy-modal__group--
|
|
6146
|
+
._teddy-modal__group--title_h9ov2_102 {
|
|
6143
6147
|
position: sticky;
|
|
6144
6148
|
inset: 0 0 auto 0;
|
|
6145
6149
|
background-color: var(--teddy-color-background-primary);
|
|
6146
6150
|
padding-top: var(--teddy-spacing-300);
|
|
6147
6151
|
}
|
|
6148
6152
|
@media (max-width: 600px) {
|
|
6149
|
-
._teddy-modal__group--
|
|
6153
|
+
._teddy-modal__group--title_h9ov2_102 {
|
|
6150
6154
|
padding-top: var(--teddy-spacing-250);
|
|
6151
6155
|
}
|
|
6152
6156
|
}
|
|
6153
|
-
._teddy-modal__group--
|
|
6157
|
+
._teddy-modal__group--title_h9ov2_102._teddy-modal__group--scroll_h9ov2_113 {
|
|
6154
6158
|
padding-block: var(--teddy-spacing-200);
|
|
6155
6159
|
}
|
|
6156
|
-
._teddy-modal__group--
|
|
6160
|
+
._teddy-modal__group--title_h9ov2_102._teddy-modal__group--scroll_h9ov2_113::before {
|
|
6157
6161
|
content: "";
|
|
6158
6162
|
position: absolute;
|
|
6159
6163
|
inset: 0 calc(var(--teddy-spacing-300) * -1) 0 calc(var(--teddy-spacing-300) * -1);
|
|
6160
6164
|
border-bottom: var(--teddy-border-width-xs) solid var(--teddy-color-border-weak);
|
|
6161
6165
|
}
|
|
6162
|
-
._teddy-modal__group--
|
|
6166
|
+
._teddy-modal__group--action_h9ov2_122 {
|
|
6163
6167
|
height: 100%;
|
|
6164
6168
|
position: sticky;
|
|
6165
6169
|
inset: auto 0 0 0;
|
|
@@ -6167,7 +6171,7 @@
|
|
|
6167
6171
|
padding: var(--teddy-spacing-200) 0 var(--teddy-spacing-300);
|
|
6168
6172
|
background-color: var(--teddy-color-background-primary);
|
|
6169
6173
|
}
|
|
6170
|
-
._teddy-modal__group--
|
|
6174
|
+
._teddy-modal__group--action_h9ov2_122._teddy-modal__group--scroll_h9ov2_113::before {
|
|
6171
6175
|
content: "";
|
|
6172
6176
|
position: absolute;
|
|
6173
6177
|
inset: 0 calc(var(--teddy-spacing-300) * -1) 0 calc(var(--teddy-spacing-300) * -1);
|
|
@@ -6175,7 +6179,7 @@
|
|
|
6175
6179
|
box-shadow: 0 0 20px 15px var(--teddy-color-background-primary);
|
|
6176
6180
|
}
|
|
6177
6181
|
@media (prefers-reduced-motion: no-preference) {
|
|
6178
|
-
@keyframes _modal-overlay-no-
|
|
6182
|
+
@keyframes _modal-overlay-no-op_h9ov2_1 {
|
|
6179
6183
|
from {
|
|
6180
6184
|
opacity: 1;
|
|
6181
6185
|
}
|
|
@@ -6183,7 +6187,7 @@
|
|
|
6183
6187
|
opacity: 1;
|
|
6184
6188
|
}
|
|
6185
6189
|
}
|
|
6186
|
-
@keyframes _modal-content-
|
|
6190
|
+
@keyframes _modal-content-show_h9ov2_1 {
|
|
6187
6191
|
from {
|
|
6188
6192
|
opacity: 0;
|
|
6189
6193
|
transform: translateY(5px) scale(0.97);
|
|
@@ -6193,7 +6197,7 @@
|
|
|
6193
6197
|
transform: translateY(0px) scale(1);
|
|
6194
6198
|
}
|
|
6195
6199
|
}
|
|
6196
|
-
@keyframes _modal-content-
|
|
6200
|
+
@keyframes _modal-content-hide_h9ov2_1 {
|
|
6197
6201
|
from {
|
|
6198
6202
|
opacity: 1;
|
|
6199
6203
|
transform: translateY(0px) scale(1);
|
|
@@ -6203,25 +6207,25 @@
|
|
|
6203
6207
|
transform: translateY(5px) scale(0.99);
|
|
6204
6208
|
}
|
|
6205
6209
|
}
|
|
6206
|
-
._teddy-
|
|
6210
|
+
._teddy-modal__overlay_h9ov2_25 {
|
|
6207
6211
|
/* Keep the overlay mounted until the children have animated */
|
|
6208
6212
|
}
|
|
6209
|
-
._teddy-
|
|
6210
|
-
animation: _modal-overlay-no-
|
|
6213
|
+
._teddy-modal__overlay_h9ov2_25:where([data-state=closed]) {
|
|
6214
|
+
animation: _modal-overlay-no-op_h9ov2_1 250ms cubic-bezier(0.16, 1, 0.3, 1);
|
|
6211
6215
|
}
|
|
6212
|
-
._teddy-
|
|
6213
|
-
animation: _teddy-fade-
|
|
6216
|
+
._teddy-modal__overlay_h9ov2_25:where([data-state=open])::before {
|
|
6217
|
+
animation: _teddy-fade-in_h9ov2_1 400ms cubic-bezier(0.16, 1, 0.3, 1);
|
|
6214
6218
|
}
|
|
6215
|
-
._teddy-
|
|
6219
|
+
._teddy-modal__overlay_h9ov2_25:where([data-state=closed])::before {
|
|
6216
6220
|
opacity: 0;
|
|
6217
|
-
animation: _teddy-fade-
|
|
6221
|
+
animation: _teddy-fade-out_h9ov2_1 250ms cubic-bezier(0.16, 1, 0.3, 1);
|
|
6218
6222
|
}
|
|
6219
|
-
._teddy-
|
|
6220
|
-
animation: _modal-content-
|
|
6223
|
+
._teddy-modal__content_h9ov2_37:where([data-state=open]) {
|
|
6224
|
+
animation: _modal-content-show_h9ov2_1 200ms cubic-bezier(0.16, 1, 0.3, 1);
|
|
6221
6225
|
}
|
|
6222
|
-
._teddy-
|
|
6226
|
+
._teddy-modal__content_h9ov2_37:where([data-state=closed]) {
|
|
6223
6227
|
opacity: 0;
|
|
6224
|
-
animation: _modal-content-
|
|
6228
|
+
animation: _modal-content-hide_h9ov2_1 150ms cubic-bezier(0.16, 1, 0.3, 1);
|
|
6225
6229
|
}
|
|
6226
6230
|
}@layer heading, button, card, notification;
|
|
6227
6231
|
@layer notification {
|
package/package.json
CHANGED
|
@@ -1,23 +0,0 @@
|
|
|
1
|
-
const styles = {
|
|
2
|
-
"teddy-modal__overlay": "_teddy-modal__overlay_mucyt_25",
|
|
3
|
-
"teddy-modal__content": "_teddy-modal__content_mucyt_37",
|
|
4
|
-
"teddy-modal__content--sm": "_teddy-modal__content--sm_mucyt_56",
|
|
5
|
-
"teddy-modal__content--md": "_teddy-modal__content--md_mucyt_61",
|
|
6
|
-
"teddy-modal__content--lg": "_teddy-modal__content--lg_mucyt_66",
|
|
7
|
-
"teddy-modal__scroll": "_teddy-modal__scroll_mucyt_70",
|
|
8
|
-
"teddy-modal__image": "_teddy-modal__image_mucyt_74",
|
|
9
|
-
"teddy-modal__close--floating": "_teddy-modal__close--floating_mucyt_84",
|
|
10
|
-
"teddy-modal__group": "_teddy-modal__group_mucyt_94",
|
|
11
|
-
"teddy-modal__group--title": "_teddy-modal__group--title_mucyt_98",
|
|
12
|
-
"teddy-modal__group--scroll": "_teddy-modal__group--scroll_mucyt_109",
|
|
13
|
-
"teddy-modal__group--action": "_teddy-modal__group--action_mucyt_118",
|
|
14
|
-
"modal-overlay-no-op": "_modal-overlay-no-op_mucyt_1",
|
|
15
|
-
"teddy-fade-in": "_teddy-fade-in_mucyt_1",
|
|
16
|
-
"teddy-fade-out": "_teddy-fade-out_mucyt_1",
|
|
17
|
-
"modal-content-show": "_modal-content-show_mucyt_1",
|
|
18
|
-
"modal-content-hide": "_modal-content-hide_mucyt_1",
|
|
19
|
-
"teddy-overlay-no-op": "_teddy-overlay-no-op_mucyt_1"
|
|
20
|
-
};
|
|
21
|
-
export {
|
|
22
|
-
styles as s
|
|
23
|
-
};
|
|
@@ -1,22 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
const styles = {
|
|
3
|
-
"teddy-modal__overlay": "_teddy-modal__overlay_mucyt_25",
|
|
4
|
-
"teddy-modal__content": "_teddy-modal__content_mucyt_37",
|
|
5
|
-
"teddy-modal__content--sm": "_teddy-modal__content--sm_mucyt_56",
|
|
6
|
-
"teddy-modal__content--md": "_teddy-modal__content--md_mucyt_61",
|
|
7
|
-
"teddy-modal__content--lg": "_teddy-modal__content--lg_mucyt_66",
|
|
8
|
-
"teddy-modal__scroll": "_teddy-modal__scroll_mucyt_70",
|
|
9
|
-
"teddy-modal__image": "_teddy-modal__image_mucyt_74",
|
|
10
|
-
"teddy-modal__close--floating": "_teddy-modal__close--floating_mucyt_84",
|
|
11
|
-
"teddy-modal__group": "_teddy-modal__group_mucyt_94",
|
|
12
|
-
"teddy-modal__group--title": "_teddy-modal__group--title_mucyt_98",
|
|
13
|
-
"teddy-modal__group--scroll": "_teddy-modal__group--scroll_mucyt_109",
|
|
14
|
-
"teddy-modal__group--action": "_teddy-modal__group--action_mucyt_118",
|
|
15
|
-
"modal-overlay-no-op": "_modal-overlay-no-op_mucyt_1",
|
|
16
|
-
"teddy-fade-in": "_teddy-fade-in_mucyt_1",
|
|
17
|
-
"teddy-fade-out": "_teddy-fade-out_mucyt_1",
|
|
18
|
-
"modal-content-show": "_modal-content-show_mucyt_1",
|
|
19
|
-
"modal-content-hide": "_modal-content-hide_mucyt_1",
|
|
20
|
-
"teddy-overlay-no-op": "_teddy-overlay-no-op_mucyt_1"
|
|
21
|
-
};
|
|
22
|
-
exports.styles = styles;
|