@stamcat/craftsman 0.0.23-alpha.13 → 0.0.23-alpha.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.
Files changed (2) hide show
  1. package/package.json +1 -1
  2. package/src/components/Modal.esm.js +32 -32
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@stamcat/craftsman",
3
- "version": "0.0.23-alpha.13",
3
+ "version": "0.0.23-alpha.15",
4
4
  "type": "module",
5
5
  "description": "A powerful, lightweight framework for design systems",
6
6
  "repository": {
package/src/components/Modal.esm.js CHANGED
@@ -1,41 +1,41 @@
1
1
  import { Button as e } from "./Button.esm.js";
2
2
  import { breakpoint as t } from "../styles/utilities/layout.esm.js";
3
- import { LuX as n } from "../../node_modules/react-icons/lu/index.esm.js";
4
- import { color as r } from "../styles/utilities/color.esm.js";
5
- import { css as i, keyframes as a } from "@emotion/react";
6
- import o from "@emotion/styled";
7
- import { Fragment as s, jsx as c, jsxs as l } from "react/jsx-runtime";
8
- import u from "react";
3
+ import { color as n } from "../styles/utilities/color.esm.js";
4
+ import { css as r, keyframes as i } from "@emotion/react";
5
+ import a from "@emotion/styled";
6
+ import { Fragment as o, jsx as s, jsxs as c } from "react/jsx-runtime";
7
+ import l from "react";
8
+ import { LuX as u } from "react-icons/lu";
9
9
  //#region src/components/Modal.tsx
10
- var d = a`
10
+ var d = i`
11
11
  from {
12
12
  opacity: 0;
13
13
  }
14
14
  to {
15
15
  opacity: 1;
16
16
  }
17
- `, f = a`
17
+ `, f = i`
18
18
  from {
19
19
  opacity: 1;
20
20
  }
21
21
  to {
22
22
  opacity: 0;
23
23
  }
24
- `, p = a`
24
+ `, p = i`
25
25
  from {
26
26
  transform: translateY(100%);
27
27
  }
28
28
  to {
29
29
  transform: translateY(0);
30
30
  }
31
- `, m = a`
31
+ `, m = i`
32
32
  from {
33
33
  transform: translateY(0);
34
34
  }
35
35
  to {
36
36
  transform: translateY(100%);
37
37
  }
38
- `, h = o.div`
38
+ `, h = a.div`
39
39
  position: fixed;
40
40
  width: 100%;
41
41
  height: 100%;
@@ -48,7 +48,7 @@ var d = a`
48
48
  justify-content: center;
49
49
  align-items: center;
50
50
  ${(e) => e.styles}
51
- `, g = o.div`
51
+ `, g = a.div`
52
52
  background-color: rgba(0, 0, 0, 0.5);
53
53
  animation: ${(e) => e.isClosing ? f : d} 0.3s ease-in-out;
54
54
  animation-fill-mode: forwards;
@@ -60,31 +60,31 @@ var d = a`
60
60
  right: 0;
61
61
  bottom: 0;
62
62
  z-index: 1001;
63
- `, _ = i`
63
+ `, _ = r`
64
64
  width: 100%;
65
65
  height: 100%;
66
- `, v = i`
66
+ `, v = r`
67
67
  width: calc(var(--w-column) * 4);
68
- `, y = i`
68
+ `, y = r`
69
69
  width: calc(var(--w-column) * 4);
70
- ${t("tablet", i`
70
+ ${t("tablet", r`
71
71
  width: calc(var(--w-column) * 6);
72
72
  `)}
73
- ${t("desktop", i`
73
+ ${t("desktop", r`
74
74
  width: calc(var(--w-column) * 8);
75
75
  `)}
76
- `, b = i`
76
+ `, b = r`
77
77
  position: fixed;
78
78
  top: 0;
79
79
  right: 0;
80
80
  height: 100%;
81
81
  ${t("mobileOnly", _)}
82
82
  ${t("tablet", v)}
83
- `, x = i`
83
+ `, x = r`
84
84
  border-radius: 8px;
85
85
  ${t("mobileOnly", _)}
86
86
  ${t("tablet", y)}
87
- `, S = o.div`
87
+ `, S = a.div`
88
88
  padding: calc(var(--w-gutter));
89
89
  z-index: 1002;
90
90
  background-color: var(--white);
@@ -102,18 +102,18 @@ var d = a`
102
102
  justify-content: space-between;
103
103
  margin-bottom: calc(var(--w-gutter) * 0.5);
104
104
  }
105
- `, C = i`
105
+ `, C = r`
106
106
  text-decoration: none;
107
107
  height: 36px;
108
108
  width: 36px;
109
109
  border-radius: 50%;
110
- `, w = o.footer`
110
+ `, w = a.footer`
111
111
  margin-top: calc(var(--w-gutter) * 2);
112
112
  background-color:var(--white);
113
113
  height: fit-content;
114
114
  display: flex;
115
115
  gap: var(--w-gutter);
116
- `, T = class extends u.PureComponent {
116
+ `, T = class extends l.PureComponent {
117
117
  state = { isClosing: !1 };
118
118
  onDismiss = () => {
119
119
  this.props.onDismiss && (this.setState({ isClosing: !0 }), setTimeout(() => {
@@ -124,30 +124,30 @@ var d = a`
124
124
  (this.props.backgroundDismiss || !0) === !0 && this.onDismiss();
125
125
  };
126
126
  render() {
127
- return this.props.visible ? /* @__PURE__ */ l(h, {
127
+ return this.props.visible ? /* @__PURE__ */ c(h, {
128
128
  styles: this.props.styles,
129
- children: [/* @__PURE__ */ l(S, {
129
+ children: [/* @__PURE__ */ c(S, {
130
130
  type: this.props.type || "dialog",
131
131
  isClosing: this.state.isClosing,
132
132
  children: [
133
- /* @__PURE__ */ l("header", { children: [this.props.header && /* @__PURE__ */ c(s, { children: this.props.header }), !this.props.hideDismissIcon && /* @__PURE__ */ c(e, {
133
+ /* @__PURE__ */ c("header", { children: [this.props.header && /* @__PURE__ */ s(o, { children: this.props.header }), !this.props.hideDismissIcon && /* @__PURE__ */ s(e, {
134
134
  variant: "primary",
135
135
  styles: C,
136
136
  onClick: this.onDismiss,
137
- children: /* @__PURE__ */ c(n, {
138
- fill: r("white"),
137
+ children: /* @__PURE__ */ s(u, {
138
+ fill: n("white"),
139
139
  viewBox: "6 8 14 14",
140
140
  size: 24
141
141
  })
142
142
  })] }),
143
- /* @__PURE__ */ c("section", { children: this.props.children }),
144
- this.props.footer && /* @__PURE__ */ c(w, { children: this.props.footer })
143
+ /* @__PURE__ */ s("section", { children: this.props.children }),
144
+ this.props.footer && /* @__PURE__ */ s(w, { children: this.props.footer })
145
145
  ]
146
- }), /* @__PURE__ */ c(g, {
146
+ }), /* @__PURE__ */ s(g, {
147
147
  isClosing: this.state.isClosing,
148
148
  onClick: this.onClickBackground
149
149
  })]
150
- }) : /* @__PURE__ */ c(s, {});
150
+ }) : /* @__PURE__ */ s(o, {});
151
151
  }
152
152
  };
153
153
  //#endregion