@tipp/ui 1.4.11 → 1.4.13
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/atoms/field-error-wrapper.js +2 -2
- package/dist/atoms/form.cjs +88 -11
- package/dist/atoms/form.cjs.map +1 -1
- package/dist/atoms/form.d.cts +3 -1
- package/dist/atoms/form.d.ts +3 -1
- package/dist/atoms/form.js +3 -1
- package/dist/atoms/index.cjs +34 -5
- package/dist/atoms/index.cjs.map +1 -1
- package/dist/atoms/index.d.cts +1 -1
- package/dist/atoms/index.d.ts +1 -1
- package/dist/atoms/index.js +56 -56
- package/dist/atoms/pagination.cjs.map +1 -1
- package/dist/atoms/pagination.js +3 -3
- package/dist/chunk-2JU3NRBH.js +97 -0
- package/dist/chunk-2JU3NRBH.js.map +1 -0
- package/dist/chunk-32VPQ7D7.js +115 -0
- package/dist/chunk-32VPQ7D7.js.map +1 -0
- package/dist/chunk-5AONIQFL.js +109 -0
- package/dist/chunk-5AONIQFL.js.map +1 -0
- package/dist/chunk-66QBRZEL.js +340 -0
- package/dist/chunk-66QBRZEL.js.map +1 -0
- package/dist/chunk-6EZF7NBC.js +164 -0
- package/dist/chunk-6EZF7NBC.js.map +1 -0
- package/dist/chunk-6IGZEBJG.js +112 -0
- package/dist/chunk-6IGZEBJG.js.map +1 -0
- package/dist/chunk-7P3RJ3PX.js +114 -0
- package/dist/chunk-7P3RJ3PX.js.map +1 -0
- package/dist/chunk-BH6Y4UOA.js +164 -0
- package/dist/chunk-BH6Y4UOA.js.map +1 -0
- package/dist/chunk-ECYH5RKA.js +192 -0
- package/dist/chunk-ECYH5RKA.js.map +1 -0
- package/dist/chunk-EYX7O5YA.js +111 -0
- package/dist/chunk-EYX7O5YA.js.map +1 -0
- package/dist/chunk-FVT3CWDP.js +340 -0
- package/dist/chunk-FVT3CWDP.js.map +1 -0
- package/dist/chunk-FWNTKFWE.js +77 -0
- package/dist/chunk-FWNTKFWE.js.map +1 -0
- package/dist/chunk-FXPW5E3O.js +169 -0
- package/dist/chunk-FXPW5E3O.js.map +1 -0
- package/dist/chunk-GFYZHWFM.js +117 -0
- package/dist/chunk-GFYZHWFM.js.map +1 -0
- package/dist/chunk-GVVNEQAM.js +114 -0
- package/dist/chunk-GVVNEQAM.js.map +1 -0
- package/dist/chunk-HCTV6GJG.js +128 -0
- package/dist/chunk-HCTV6GJG.js.map +1 -0
- package/dist/chunk-HS4UMG25.js +60 -0
- package/dist/chunk-HS4UMG25.js.map +1 -0
- package/dist/chunk-IFONY3P4.js +83 -0
- package/dist/chunk-IFONY3P4.js.map +1 -0
- package/dist/chunk-IH5KYNBX.js +117 -0
- package/dist/chunk-IH5KYNBX.js.map +1 -0
- package/dist/chunk-IJRCXNT4.js +340 -0
- package/dist/chunk-IJRCXNT4.js.map +1 -0
- package/dist/chunk-JOQA4635.js +110 -0
- package/dist/chunk-JOQA4635.js.map +1 -0
- package/dist/chunk-KFUQSMZY.js +340 -0
- package/dist/chunk-KFUQSMZY.js.map +1 -0
- package/dist/chunk-KKEXBKSB.js +112 -0
- package/dist/chunk-KKEXBKSB.js.map +1 -0
- package/dist/chunk-KQ75QB4F.js +340 -0
- package/dist/chunk-KQ75QB4F.js.map +1 -0
- package/dist/chunk-LMDAXWJG.js +192 -0
- package/dist/chunk-LMDAXWJG.js.map +1 -0
- package/dist/chunk-LZCKTU33.js +109 -0
- package/dist/chunk-LZCKTU33.js.map +1 -0
- package/dist/chunk-M3XIYHN4.js +340 -0
- package/dist/chunk-M3XIYHN4.js.map +1 -0
- package/dist/chunk-MOAXPZLZ.js +114 -0
- package/dist/chunk-MOAXPZLZ.js.map +1 -0
- package/dist/chunk-NCJ7W6Q6.js +111 -0
- package/dist/chunk-NCJ7W6Q6.js.map +1 -0
- package/dist/chunk-T4CFVC4D.js +83 -0
- package/dist/chunk-T4CFVC4D.js.map +1 -0
- package/dist/chunk-T5SEG6AS.js +164 -0
- package/dist/chunk-T5SEG6AS.js.map +1 -0
- package/dist/chunk-TJKYEERY.js +114 -0
- package/dist/chunk-TJKYEERY.js.map +1 -0
- package/dist/chunk-TOBTSM5I.js +63 -0
- package/dist/chunk-TOBTSM5I.js.map +1 -0
- package/dist/chunk-U4J2ORGT.js +169 -0
- package/dist/chunk-U4J2ORGT.js.map +1 -0
- package/dist/chunk-UGS3D4GN.js +111 -0
- package/dist/chunk-UGS3D4GN.js.map +1 -0
- package/dist/chunk-UNKNG6YR.js +340 -0
- package/dist/chunk-UNKNG6YR.js.map +1 -0
- package/dist/chunk-V2PH6RFH.js +164 -0
- package/dist/chunk-V2PH6RFH.js.map +1 -0
- package/dist/chunk-W3QLZMC4.js +192 -0
- package/dist/chunk-W3QLZMC4.js.map +1 -0
- package/dist/chunk-WLRX3IFJ.js +110 -0
- package/dist/chunk-WLRX3IFJ.js.map +1 -0
- package/dist/chunk-WX4S7KAG.js +109 -0
- package/dist/chunk-WX4S7KAG.js.map +1 -0
- package/dist/chunk-YNIACSWN.js +164 -0
- package/dist/chunk-YNIACSWN.js.map +1 -0
- package/dist/chunk-YRHQKIRO.js +117 -0
- package/dist/chunk-YRHQKIRO.js.map +1 -0
- package/dist/icon.cjs +2 -0
- package/dist/icon.cjs.map +1 -1
- package/dist/icon.d.cts +1 -1
- package/dist/icon.d.ts +1 -1
- package/dist/icon.js +3 -1
- package/dist/index.cjs +36 -5
- package/dist/index.cjs.map +1 -1
- package/dist/index.css +4 -7
- package/dist/index.css.map +1 -1
- package/dist/index.d.cts +2 -2
- package/dist/index.d.ts +2 -2
- package/dist/index.js +74 -72
- package/dist/molecules/date-picker/index.cjs.map +1 -1
- package/dist/molecules/date-picker/index.js +3 -3
- package/dist/molecules/expand-table/index.cjs.map +1 -1
- package/dist/molecules/expand-table/index.js +25 -25
- package/dist/molecules/expand-table/row.js +23 -23
- package/dist/molecules/form.cjs +218 -0
- package/dist/molecules/form.cjs.map +1 -0
- package/dist/molecules/form.d.cts +22 -0
- package/dist/molecules/form.d.ts +22 -0
- package/dist/molecules/form.js +10 -0
- package/dist/molecules/form.js.map +1 -0
- package/dist/molecules/index.cjs.map +1 -1
- package/dist/molecules/index.js +31 -31
- package/dist/molecules/learning-post.js +3 -3
- package/dist/molecules/navigation.js +24 -24
- package/dist/molecules/stepper.cjs.map +1 -1
- package/dist/molecules/stepper.js +3 -3
- package/dist/molecules/tag-selector.cjs.map +1 -1
- package/dist/molecules/tag-selector.js +24 -24
- package/package.json +1 -1
- package/src/atoms/index.ts +1 -1
- package/src/icon.ts +1 -0
- package/src/molecules/form.tsx +122 -0
- package/src/atoms/form.tsx +0 -72
|
@@ -2,64 +2,64 @@ import {
|
|
|
2
2
|
Row
|
|
3
3
|
} from "../../chunk-PCWEW2UL.js";
|
|
4
4
|
import "../../chunk-KTVZ4KLX.js";
|
|
5
|
+
import "../../chunk-MOAXPZLZ.js";
|
|
6
|
+
import "../../chunk-ILRUXI2E.js";
|
|
7
|
+
import "../../chunk-JPIZP2PZ.js";
|
|
5
8
|
import "../../chunk-CYYWMYE7.js";
|
|
9
|
+
import "../../chunk-3JRNKBMN.js";
|
|
10
|
+
import "../../chunk-HYITAA4J.js";
|
|
6
11
|
import "../../chunk-5H3YPCZK.js";
|
|
7
12
|
import "../../chunk-FR2GDOU2.js";
|
|
8
13
|
import "../../chunk-74DX4CU7.js";
|
|
9
14
|
import "../../chunk-OYM4XCHQ.js";
|
|
10
15
|
import "../../chunk-YJ7ZFOYL.js";
|
|
11
16
|
import "../../chunk-5ZITU5L7.js";
|
|
12
|
-
import "../../chunk-
|
|
13
|
-
import "../../chunk-
|
|
17
|
+
import "../../chunk-365QMK4D.js";
|
|
18
|
+
import "../../chunk-YO3BQW6S.js";
|
|
14
19
|
import "../../chunk-6IVCARWS.js";
|
|
15
20
|
import "../../chunk-6DJOIRMF.js";
|
|
16
21
|
import "../../chunk-FPD73OHW.js";
|
|
17
22
|
import "../../chunk-ZKZDVS7G.js";
|
|
18
23
|
import "../../chunk-MUNMDHRF.js";
|
|
19
24
|
import "../../chunk-TVDKGMBI.js";
|
|
20
|
-
import "../../chunk-
|
|
21
|
-
import "../../chunk-HYITAA4J.js";
|
|
25
|
+
import "../../chunk-O3T3TM3V.js";
|
|
22
26
|
import "../../chunk-XQOL7UBI.js";
|
|
23
27
|
import "../../chunk-TULWX7D6.js";
|
|
24
28
|
import "../../chunk-SIM6HKVI.js";
|
|
25
|
-
import "../../chunk-
|
|
29
|
+
import "../../chunk-HCTV6GJG.js";
|
|
30
|
+
import "../../chunk-O3DNDMV3.js";
|
|
26
31
|
import "../../chunk-5AVBYDPB.js";
|
|
27
|
-
import "../../chunk-
|
|
28
|
-
import "../../chunk-
|
|
32
|
+
import "../../chunk-UC627KGO.js";
|
|
33
|
+
import "../../chunk-4WFMOFN2.js";
|
|
34
|
+
import "../../chunk-WKFZ5MMN.js";
|
|
35
|
+
import "../../chunk-ACVANQJ4.js";
|
|
29
36
|
import "../../chunk-2DZ2Y3JI.js";
|
|
30
|
-
import "../../chunk-
|
|
37
|
+
import "../../chunk-QDZS4B6A.js";
|
|
38
|
+
import "../../chunk-52MVZ6AN.js";
|
|
31
39
|
import "../../chunk-25HMMI7R.js";
|
|
32
|
-
import "../../chunk-2CVXGGI5.js";
|
|
33
40
|
import "../../chunk-EGEQY3KT.js";
|
|
34
41
|
import "../../chunk-HK224ADT.js";
|
|
35
|
-
import "../../chunk-
|
|
36
|
-
import "../../chunk-
|
|
42
|
+
import "../../chunk-MIMJ7LON.js";
|
|
43
|
+
import "../../chunk-IQEEPHOY.js";
|
|
44
|
+
import "../../chunk-LHCDPZ5E.js";
|
|
37
45
|
import "../../chunk-OHMOP5PV.js";
|
|
38
46
|
import "../../chunk-LZJR77Q2.js";
|
|
39
47
|
import "../../chunk-Q37G2GS6.js";
|
|
40
48
|
import "../../chunk-VTJZMOSP.js";
|
|
41
49
|
import "../../chunk-BDVTRPXG.js";
|
|
42
|
-
import "../../chunk-
|
|
43
|
-
import "../../chunk-
|
|
44
|
-
import "../../chunk-
|
|
45
|
-
import "../../chunk-ACVANQJ4.js";
|
|
46
|
-
import "../../chunk-52MVZ6AN.js";
|
|
50
|
+
import "../../chunk-3SSSCLJ5.js";
|
|
51
|
+
import "../../chunk-EWD4AO5N.js";
|
|
52
|
+
import "../../chunk-YGL6SWKN.js";
|
|
47
53
|
import "../../chunk-4Y5BEXVN.js";
|
|
48
54
|
import "../../chunk-U7JPP7WJ.js";
|
|
49
55
|
import "../../chunk-LQY4RKWI.js";
|
|
50
56
|
import "../../chunk-ZD7MNMED.js";
|
|
51
57
|
import "../../chunk-B6XJN6EC.js";
|
|
52
58
|
import "../../chunk-UVKNLJDZ.js";
|
|
53
|
-
import "../../chunk-
|
|
54
|
-
import "../../chunk-IQEEPHOY.js";
|
|
55
|
-
import "../../chunk-LHCDPZ5E.js";
|
|
56
|
-
import "../../chunk-66C4U3BG.js";
|
|
59
|
+
import "../../chunk-FWNTKFWE.js";
|
|
57
60
|
import "../../chunk-J242TTFH.js";
|
|
58
61
|
import "../../chunk-EAXUQEO5.js";
|
|
59
62
|
import "../../chunk-YJCCE5WP.js";
|
|
60
|
-
import "../../chunk-3SSSCLJ5.js";
|
|
61
|
-
import "../../chunk-EWD4AO5N.js";
|
|
62
|
-
import "../../chunk-YGL6SWKN.js";
|
|
63
63
|
import "../../chunk-N552FDTV.js";
|
|
64
64
|
export {
|
|
65
65
|
Row
|
|
@@ -0,0 +1,218 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __create = Object.create;
|
|
3
|
+
var __defProp = Object.defineProperty;
|
|
4
|
+
var __defProps = Object.defineProperties;
|
|
5
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
6
|
+
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
7
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
8
|
+
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
9
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
10
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
11
|
+
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
12
|
+
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
13
|
+
var __spreadValues = (a, b) => {
|
|
14
|
+
for (var prop in b || (b = {}))
|
|
15
|
+
if (__hasOwnProp.call(b, prop))
|
|
16
|
+
__defNormalProp(a, prop, b[prop]);
|
|
17
|
+
if (__getOwnPropSymbols)
|
|
18
|
+
for (var prop of __getOwnPropSymbols(b)) {
|
|
19
|
+
if (__propIsEnum.call(b, prop))
|
|
20
|
+
__defNormalProp(a, prop, b[prop]);
|
|
21
|
+
}
|
|
22
|
+
return a;
|
|
23
|
+
};
|
|
24
|
+
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
25
|
+
var __objRest = (source, exclude) => {
|
|
26
|
+
var target = {};
|
|
27
|
+
for (var prop in source)
|
|
28
|
+
if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
|
|
29
|
+
target[prop] = source[prop];
|
|
30
|
+
if (source != null && __getOwnPropSymbols)
|
|
31
|
+
for (var prop of __getOwnPropSymbols(source)) {
|
|
32
|
+
if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
|
|
33
|
+
target[prop] = source[prop];
|
|
34
|
+
}
|
|
35
|
+
return target;
|
|
36
|
+
};
|
|
37
|
+
var __export = (target, all) => {
|
|
38
|
+
for (var name in all)
|
|
39
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
40
|
+
};
|
|
41
|
+
var __copyProps = (to, from, except, desc) => {
|
|
42
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
43
|
+
for (let key of __getOwnPropNames(from))
|
|
44
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
45
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
46
|
+
}
|
|
47
|
+
return to;
|
|
48
|
+
};
|
|
49
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
50
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
51
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
52
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
53
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
54
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
55
|
+
mod
|
|
56
|
+
));
|
|
57
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
58
|
+
|
|
59
|
+
// src/molecules/form.tsx
|
|
60
|
+
var form_exports = {};
|
|
61
|
+
__export(form_exports, {
|
|
62
|
+
Form: () => Form
|
|
63
|
+
});
|
|
64
|
+
module.exports = __toCommonJS(form_exports);
|
|
65
|
+
var RadixForm = __toESM(require("@radix-ui/react-form"), 1);
|
|
66
|
+
var import_react3 = require("react");
|
|
67
|
+
|
|
68
|
+
// src/atoms/heading.tsx
|
|
69
|
+
var import_themes = require("@radix-ui/themes");
|
|
70
|
+
var import_react = require("react");
|
|
71
|
+
var import_themes2 = require("@radix-ui/themes");
|
|
72
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
|
73
|
+
function Heading2(props) {
|
|
74
|
+
const _a = props, { size, children, variant } = _a, rest = __objRest(_a, ["size", "children", "variant"]);
|
|
75
|
+
const radixSize = (0, import_react.useMemo)(() => {
|
|
76
|
+
switch (variant) {
|
|
77
|
+
case "heading1":
|
|
78
|
+
return "7";
|
|
79
|
+
case "heading2":
|
|
80
|
+
return "6";
|
|
81
|
+
case "heading3":
|
|
82
|
+
return "5";
|
|
83
|
+
case "heading4":
|
|
84
|
+
return "4";
|
|
85
|
+
case "heading5":
|
|
86
|
+
return "3";
|
|
87
|
+
default:
|
|
88
|
+
return size;
|
|
89
|
+
}
|
|
90
|
+
}, [size, variant]);
|
|
91
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_themes.Heading, __spreadProps(__spreadValues({}, rest), { size: radixSize, children }));
|
|
92
|
+
}
|
|
93
|
+
|
|
94
|
+
// src/atoms/typo.tsx
|
|
95
|
+
var import_themes3 = require("@radix-ui/themes");
|
|
96
|
+
var import_react2 = require("react");
|
|
97
|
+
var import_jsx_runtime2 = require("react/jsx-runtime");
|
|
98
|
+
var Typo = (0, import_react2.forwardRef)(
|
|
99
|
+
(props, ref) => {
|
|
100
|
+
const _a = props, { size, variant, children } = _a, rest = __objRest(_a, ["size", "variant", "children"]);
|
|
101
|
+
const radixSize = (0, import_react2.useMemo)(() => {
|
|
102
|
+
if (size !== void 0)
|
|
103
|
+
return size;
|
|
104
|
+
switch (variant) {
|
|
105
|
+
case "caption":
|
|
106
|
+
return "1";
|
|
107
|
+
case "subtitle":
|
|
108
|
+
return "3";
|
|
109
|
+
case "body":
|
|
110
|
+
default:
|
|
111
|
+
return "2";
|
|
112
|
+
}
|
|
113
|
+
}, [size, variant]);
|
|
114
|
+
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_themes3.Text, __spreadProps(__spreadValues({}, rest), { ref, size: radixSize, children }));
|
|
115
|
+
}
|
|
116
|
+
);
|
|
117
|
+
Typo.displayName = "Typo";
|
|
118
|
+
|
|
119
|
+
// src/molecules/form.tsx
|
|
120
|
+
var import_jsx_runtime3 = require("react/jsx-runtime");
|
|
121
|
+
var Root2 = (0, import_react3.forwardRef)(
|
|
122
|
+
(_a, ref) => {
|
|
123
|
+
var _b = _a, { children, className } = _b, rest = __objRest(_b, ["children", "className"]);
|
|
124
|
+
return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
125
|
+
RadixForm.Root,
|
|
126
|
+
__spreadProps(__spreadValues({}, rest), {
|
|
127
|
+
className: `FormRoot ${className || ""}`,
|
|
128
|
+
ref,
|
|
129
|
+
children
|
|
130
|
+
})
|
|
131
|
+
);
|
|
132
|
+
}
|
|
133
|
+
);
|
|
134
|
+
Root2.displayName = "FORM_ROOT";
|
|
135
|
+
var FieldContext = (0, import_react3.createContext)({
|
|
136
|
+
name: ""
|
|
137
|
+
});
|
|
138
|
+
var Field2 = (0, import_react3.forwardRef)(
|
|
139
|
+
(_a, ref) => {
|
|
140
|
+
var _b = _a, { children, className } = _b, rest = __objRest(_b, ["children", "className"]);
|
|
141
|
+
return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
142
|
+
RadixForm.Field,
|
|
143
|
+
__spreadProps(__spreadValues({}, rest), {
|
|
144
|
+
className: `FormField ${className || ""}`,
|
|
145
|
+
ref,
|
|
146
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(FieldContext.Provider, { value: rest, children })
|
|
147
|
+
})
|
|
148
|
+
);
|
|
149
|
+
}
|
|
150
|
+
);
|
|
151
|
+
Field2.displayName = "FORM_FIELD";
|
|
152
|
+
function HeadingLabel(props) {
|
|
153
|
+
return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Heading2, __spreadProps(__spreadValues({ variant: "heading5" }, props), { children: props.children }));
|
|
154
|
+
}
|
|
155
|
+
var Label2 = (0, import_react3.forwardRef)(
|
|
156
|
+
(_a, ref) => {
|
|
157
|
+
var _b = _a, { children, className, variant = "body" } = _b, rest = __objRest(_b, ["children", "className", "variant"]);
|
|
158
|
+
const Comp = variant === "title" ? HeadingLabel : Typo;
|
|
159
|
+
const fieldProps = (0, import_react3.useContext)(FieldContext);
|
|
160
|
+
return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
161
|
+
RadixForm.Label,
|
|
162
|
+
__spreadProps(__spreadValues({}, rest), {
|
|
163
|
+
asChild: true,
|
|
164
|
+
className: `FormLabel ${className || ""}`,
|
|
165
|
+
ref,
|
|
166
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(Comp, { children: [
|
|
167
|
+
children,
|
|
168
|
+
fieldProps.required ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Typo, { as: "span", color: "tomato", children: ` *` }) : null
|
|
169
|
+
] })
|
|
170
|
+
})
|
|
171
|
+
);
|
|
172
|
+
}
|
|
173
|
+
);
|
|
174
|
+
Label2.displayName = "FORM_Label";
|
|
175
|
+
var Message2 = (0, import_react3.forwardRef)(
|
|
176
|
+
(_a, ref) => {
|
|
177
|
+
var _b = _a, { children, className } = _b, rest = __objRest(_b, ["children", "className"]);
|
|
178
|
+
return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
179
|
+
RadixForm.Message,
|
|
180
|
+
__spreadProps(__spreadValues({}, rest), {
|
|
181
|
+
asChild: true,
|
|
182
|
+
className: `FormMessage ${className || ""}`,
|
|
183
|
+
ref,
|
|
184
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Typo, { color: "red", children })
|
|
185
|
+
})
|
|
186
|
+
);
|
|
187
|
+
}
|
|
188
|
+
);
|
|
189
|
+
Message2.displayName = "FORM_Message";
|
|
190
|
+
var Control2 = (0, import_react3.forwardRef)(
|
|
191
|
+
(_a, ref) => {
|
|
192
|
+
var _b = _a, { className } = _b, rest = __objRest(_b, ["className"]);
|
|
193
|
+
const fieldProps = (0, import_react3.useContext)(FieldContext);
|
|
194
|
+
return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
195
|
+
RadixForm.Control,
|
|
196
|
+
__spreadProps(__spreadValues({}, rest), {
|
|
197
|
+
className: `FormControl ${className || ""}`,
|
|
198
|
+
ref,
|
|
199
|
+
required: fieldProps.required
|
|
200
|
+
})
|
|
201
|
+
);
|
|
202
|
+
}
|
|
203
|
+
);
|
|
204
|
+
Control2.displayName = "FORM_Control";
|
|
205
|
+
var Form = {
|
|
206
|
+
Root: Root2,
|
|
207
|
+
Field: Field2,
|
|
208
|
+
Label: Label2,
|
|
209
|
+
Message: Message2,
|
|
210
|
+
ValidityState,
|
|
211
|
+
Control: RadixForm.Control,
|
|
212
|
+
Submit: RadixForm.Submit
|
|
213
|
+
};
|
|
214
|
+
// Annotate the CommonJS export names for ESM import in node:
|
|
215
|
+
0 && (module.exports = {
|
|
216
|
+
Form
|
|
217
|
+
});
|
|
218
|
+
//# sourceMappingURL=form.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/molecules/form.tsx","../../src/atoms/heading.tsx","../../src/atoms/typo.tsx"],"sourcesContent":["import * as RadixForm from '@radix-ui/react-form';\nimport { createContext, forwardRef, useContext } from 'react';\nimport type { HeadingProps } from '@radix-ui/themes';\nimport { Heading } from '../atoms/heading';\nimport { Typo } from '../atoms/typo';\n\nconst Root = forwardRef<HTMLFormElement, RadixForm.FormProps>(\n ({ children, className, ...rest }, ref) => {\n return (\n <RadixForm.Root\n {...rest}\n className={`FormRoot ${className || ''}`}\n ref={ref}\n >\n {children}\n </RadixForm.Root>\n );\n }\n);\n\nRoot.displayName = 'FORM_ROOT';\n\ntype FormFieldProps = RadixForm.FormFieldProps & { required?: boolean };\n\nconst FieldContext = createContext<FormFieldProps>({\n name: '',\n});\n\nconst Field = forwardRef<HTMLDivElement, FormFieldProps>(\n ({ children, className, ...rest }, ref) => {\n return (\n <RadixForm.Field\n {...rest}\n className={`FormField ${className || ''}`}\n ref={ref}\n >\n <FieldContext.Provider value={rest}>{children}</FieldContext.Provider>\n </RadixForm.Field>\n );\n }\n);\nField.displayName = 'FORM_FIELD';\n\ntype LabelProps = RadixForm.FormLabelProps & {\n /** label의 타입을 지정 */\n variant?: 'title' | 'body';\n};\n\nfunction HeadingLabel(props: HeadingProps): React.ReactElement {\n return (\n <Heading variant=\"heading5\" {...props}>\n {props.children}\n </Heading>\n );\n}\n\nconst Label = forwardRef<HTMLLabelElement, LabelProps>(\n ({ children, className, variant = 'body', ...rest }, ref) => {\n const Comp = variant === 'title' ? HeadingLabel : Typo;\n const fieldProps = useContext(FieldContext);\n return (\n <RadixForm.Label\n {...rest}\n asChild\n className={`FormLabel ${className || ''}`}\n ref={ref}\n >\n <Comp>\n {children}\n {fieldProps.required ? (\n <Typo as=\"span\" color=\"tomato\">\n {` *`}\n </Typo>\n ) : null}\n </Comp>\n </RadixForm.Label>\n );\n }\n);\nLabel.displayName = 'FORM_Label';\n\nconst Message = forwardRef<HTMLSpanElement, RadixForm.FormMessageProps>(\n ({ children, className, ...rest }, ref) => {\n return (\n <RadixForm.Message\n {...rest}\n asChild\n className={`FormMessage ${className || ''}`}\n ref={ref}\n >\n <Typo color=\"red\">{children}</Typo>\n </RadixForm.Message>\n );\n }\n);\nMessage.displayName = 'FORM_Message';\n\ntype ControlProps = Omit<RadixForm.FormControlProps, 'required'>;\nconst Control = forwardRef<HTMLInputElement, ControlProps>(\n ({ className, ...rest }, ref) => {\n const fieldProps = useContext(FieldContext);\n return (\n <RadixForm.Control\n {...rest}\n className={`FormControl ${className || ''}`}\n ref={ref}\n required={fieldProps.required}\n />\n );\n }\n);\nControl.displayName = 'FORM_Control';\n\nexport const Form = {\n Root,\n Field,\n Label,\n Message,\n ValidityState,\n Control: RadixForm.Control,\n Submit: RadixForm.Submit,\n};\n","import {\n Heading as RadixHeading,\n type HeadingProps as RadixHeadingProps,\n} from '@radix-ui/themes';\nimport { useMemo } from 'react';\n\nexport { Heading as RadixHeading } from '@radix-ui/themes';\n\nexport type HeadingProps = RadixHeadingProps & {\n variant?: 'heading1' | 'heading2' | 'heading3' | 'heading4' | 'heading5';\n};\n\nexport function Heading(props: HeadingProps): React.ReactElement {\n const { size, children, variant, ...rest } = props;\n const radixSize = useMemo<RadixHeadingProps['size']>(() => {\n switch (variant) {\n case 'heading1':\n return '7';\n case 'heading2':\n return '6';\n case 'heading3':\n return '5';\n case 'heading4':\n return '4';\n case 'heading5':\n return '3';\n default:\n return size;\n }\n }, [size, variant]);\n\n return (\n <RadixHeading {...rest} size={radixSize}>\n {children}\n </RadixHeading>\n );\n}\n","import type { TextProps as RadixTextProps } from '@radix-ui/themes';\nimport { Text as RadixText } from '@radix-ui/themes';\nimport React, { useMemo, forwardRef } from 'react';\n\nexport type TypoProps = RadixTextProps & {\n variant?: 'body' | 'caption' | 'subtitle';\n};\n\nexport const Typo = forwardRef<HTMLSpanElement, TypoProps>(\n (props: TypoProps, ref): React.ReactElement => {\n const { size, variant, children, ...rest } = props;\n\n const radixSize = useMemo<RadixTextProps['size']>(() => {\n if (size !== undefined) return size;\n switch (variant) {\n case 'caption':\n return '1';\n case 'subtitle':\n return '3';\n case 'body':\n default:\n return '2';\n }\n }, [size, variant]);\n\n return (\n <RadixText {...rest} ref={ref} size={radixSize}>\n {children}\n </RadixText>\n );\n }\n);\n\nTypo.displayName = 'Typo';\n"],"mappings":"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","names":["import_react","import_themes","Heading","RadixHeading","import_themes","import_react","import_jsx_runtime","RadixText","import_jsx_runtime","Root","Field","Heading","Label","Message","Control"]}
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import * as react from 'react';
|
|
2
|
+
import * as RadixForm from '@radix-ui/react-form';
|
|
3
|
+
|
|
4
|
+
declare const Form: {
|
|
5
|
+
Root: react.ForwardRefExoticComponent<RadixForm.FormProps & react.RefAttributes<HTMLFormElement>>;
|
|
6
|
+
Field: react.ForwardRefExoticComponent<RadixForm.FormFieldProps & {
|
|
7
|
+
required?: boolean | undefined;
|
|
8
|
+
} & react.RefAttributes<HTMLDivElement>>;
|
|
9
|
+
Label: react.ForwardRefExoticComponent<RadixForm.FormLabelProps & {
|
|
10
|
+
/** label의 타입을 지정 */
|
|
11
|
+
variant?: "body" | "title" | undefined;
|
|
12
|
+
} & react.RefAttributes<HTMLLabelElement>>;
|
|
13
|
+
Message: react.ForwardRefExoticComponent<RadixForm.FormMessageProps & react.RefAttributes<HTMLSpanElement>>;
|
|
14
|
+
ValidityState: {
|
|
15
|
+
new (): ValidityState;
|
|
16
|
+
prototype: ValidityState;
|
|
17
|
+
};
|
|
18
|
+
Control: react.ForwardRefExoticComponent<RadixForm.FormControlProps & react.RefAttributes<HTMLInputElement>>;
|
|
19
|
+
Submit: react.ForwardRefExoticComponent<RadixForm.FormSubmitProps & react.RefAttributes<HTMLButtonElement>>;
|
|
20
|
+
};
|
|
21
|
+
|
|
22
|
+
export { Form };
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import * as react from 'react';
|
|
2
|
+
import * as RadixForm from '@radix-ui/react-form';
|
|
3
|
+
|
|
4
|
+
declare const Form: {
|
|
5
|
+
Root: react.ForwardRefExoticComponent<RadixForm.FormProps & react.RefAttributes<HTMLFormElement>>;
|
|
6
|
+
Field: react.ForwardRefExoticComponent<RadixForm.FormFieldProps & {
|
|
7
|
+
required?: boolean | undefined;
|
|
8
|
+
} & react.RefAttributes<HTMLDivElement>>;
|
|
9
|
+
Label: react.ForwardRefExoticComponent<RadixForm.FormLabelProps & {
|
|
10
|
+
/** label의 타입을 지정 */
|
|
11
|
+
variant?: "body" | "title" | undefined;
|
|
12
|
+
} & react.RefAttributes<HTMLLabelElement>>;
|
|
13
|
+
Message: react.ForwardRefExoticComponent<RadixForm.FormMessageProps & react.RefAttributes<HTMLSpanElement>>;
|
|
14
|
+
ValidityState: {
|
|
15
|
+
new (): ValidityState;
|
|
16
|
+
prototype: ValidityState;
|
|
17
|
+
};
|
|
18
|
+
Control: react.ForwardRefExoticComponent<RadixForm.FormControlProps & react.RefAttributes<HTMLInputElement>>;
|
|
19
|
+
Submit: react.ForwardRefExoticComponent<RadixForm.FormSubmitProps & react.RefAttributes<HTMLButtonElement>>;
|
|
20
|
+
};
|
|
21
|
+
|
|
22
|
+
export { Form };
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}
|