@cerberus-design/react 0.15.0-next-e0ce56e → 0.15.0-next-5d7dc1e
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/build/legacy/_tsup-dts-rollup.d.cts +491 -119
- package/build/legacy/components/DatePicker.client.cjs +67 -89
- package/build/legacy/components/DatePicker.client.cjs.map +1 -1
- package/build/legacy/components/Fieldset.cjs +4 -17
- package/build/legacy/components/Fieldset.cjs.map +1 -1
- package/build/legacy/components/FieldsetLabel.cjs.map +1 -1
- package/build/legacy/components/FileStatus.cjs +126 -79
- package/build/legacy/components/FileStatus.cjs.map +1 -1
- package/build/legacy/components/Legend.cjs +10 -22
- package/build/legacy/components/Legend.cjs.map +1 -1
- package/build/legacy/components/Radio.cjs +4 -21
- package/build/legacy/components/Radio.cjs.map +1 -1
- package/build/legacy/components/Select.cjs +19 -54
- package/build/legacy/components/Select.cjs.map +1 -1
- package/build/legacy/components/Toggle.cjs +17 -24
- package/build/legacy/components/Toggle.cjs.map +1 -1
- package/build/legacy/components/button/button.cjs +1 -1
- package/build/legacy/components/button/button.cjs.map +1 -1
- package/build/legacy/components/button/index.cjs +1 -1
- package/build/legacy/components/button/index.cjs.map +1 -1
- package/build/legacy/components/button/parts.cjs +1 -1
- package/build/legacy/components/button/parts.cjs.map +1 -1
- package/build/legacy/components/checkbox/checkbox-icon.cjs +121 -0
- package/build/legacy/components/checkbox/checkbox-icon.cjs.map +1 -0
- package/build/legacy/components/checkbox/checkbox.cjs +165 -0
- package/build/legacy/components/checkbox/checkbox.cjs.map +1 -0
- package/build/legacy/components/checkbox/index.cjs +179 -0
- package/build/legacy/components/checkbox/index.cjs.map +1 -0
- package/build/legacy/components/checkbox/parts.cjs +89 -0
- package/build/legacy/components/checkbox/parts.cjs.map +1 -0
- package/build/legacy/components/checkbox/primitives.cjs +87 -0
- package/build/legacy/components/checkbox/primitives.cjs.map +1 -0
- package/build/legacy/components/{FieldMessage.cjs → deprecated/FieldMessage.cjs} +4 -17
- package/build/legacy/components/deprecated/FieldMessage.cjs.map +1 -0
- package/build/legacy/components/{Textarea.cjs → deprecated/Label.cjs} +24 -36
- package/build/legacy/components/deprecated/Label.cjs.map +1 -0
- package/build/legacy/components/field/field.cjs +130 -0
- package/build/legacy/components/field/field.cjs.map +1 -0
- package/build/legacy/components/field/index.cjs +267 -0
- package/build/legacy/components/field/index.cjs.map +1 -0
- package/build/legacy/components/field/parts.cjs +188 -0
- package/build/legacy/components/field/parts.cjs.map +1 -0
- package/build/legacy/components/field/primitives.cjs +191 -0
- package/build/legacy/components/field/primitives.cjs.map +1 -0
- package/build/legacy/components/field/start-indicator.cjs +45 -0
- package/build/legacy/components/field/start-indicator.cjs.map +1 -0
- package/build/legacy/components/field/status-indicator.cjs +78 -0
- package/build/legacy/components/field/status-indicator.cjs.map +1 -0
- package/build/legacy/components/for.cjs +38 -0
- package/build/legacy/components/for.cjs.map +1 -0
- package/build/legacy/context/confirm-modal.cjs +1 -1
- package/build/legacy/context/confirm-modal.cjs.map +1 -1
- package/build/legacy/context/cta-modal.cjs +1 -1
- package/build/legacy/context/cta-modal.cjs.map +1 -1
- package/build/legacy/context/field.cjs +23 -4
- package/build/legacy/context/field.cjs.map +1 -1
- package/build/legacy/context/notification-center.cjs.map +1 -1
- package/build/legacy/context/prompt-modal.cjs +168 -166
- package/build/legacy/context/prompt-modal.cjs.map +1 -1
- package/build/legacy/hooks/useDate.cjs.map +1 -1
- package/build/legacy/index.cjs +1274 -1123
- package/build/legacy/index.cjs.map +1 -1
- package/build/legacy/utils/index.cjs +22 -2
- package/build/legacy/utils/index.cjs.map +1 -1
- package/build/modern/_tsup-dts-rollup.d.ts +491 -119
- package/build/modern/{chunk-2JX27W6Y.js → chunk-2BIHLH4V.js} +2 -2
- package/build/modern/chunk-2BIHLH4V.js.map +1 -0
- package/build/modern/{chunk-3ZDFQO25.js → chunk-6EUC3SUI.js} +4 -7
- package/build/modern/chunk-6EUC3SUI.js.map +1 -0
- package/build/modern/chunk-6I2FW4WI.js +33 -0
- package/build/modern/chunk-6I2FW4WI.js.map +1 -0
- package/build/modern/{chunk-MER66QUY.js → chunk-6KZVE4HC.js} +1 -1
- package/build/modern/{chunk-MER66QUY.js.map → chunk-6KZVE4HC.js.map} +1 -1
- package/build/modern/{chunk-FTPZHG6J.js → chunk-6WOJAMZV.js} +3 -9
- package/build/modern/chunk-6WOJAMZV.js.map +1 -0
- package/build/modern/chunk-77FJSNGD.js +13 -0
- package/build/modern/chunk-77FJSNGD.js.map +1 -0
- package/build/modern/chunk-BL7G3577.js +29 -0
- package/build/modern/chunk-BL7G3577.js.map +1 -0
- package/build/modern/chunk-BPRF34DU.js +62 -0
- package/build/modern/chunk-BPRF34DU.js.map +1 -0
- package/build/modern/{chunk-7P7OWBGV.js → chunk-CF3EHG42.js} +10 -10
- package/build/modern/chunk-CF3EHG42.js.map +1 -0
- package/build/modern/{chunk-Q4IV5NUT.js → chunk-CMYD5KWA.js} +40 -43
- package/build/modern/chunk-CMYD5KWA.js.map +1 -0
- package/build/modern/chunk-CNA2VKAH.js +43 -0
- package/build/modern/chunk-CNA2VKAH.js.map +1 -0
- package/build/modern/chunk-EL4MX2PG.js +22 -0
- package/build/modern/chunk-EL4MX2PG.js.map +1 -0
- package/build/modern/chunk-FBS7AX76.js +37 -0
- package/build/modern/chunk-FBS7AX76.js.map +1 -0
- package/build/modern/{chunk-KU2AWAK3.js → chunk-FK52US7K.js} +7 -20
- package/build/modern/chunk-FK52US7K.js.map +1 -0
- package/build/modern/{chunk-Z7FGXAND.js → chunk-FMRWRVUS.js} +2 -2
- package/build/modern/{chunk-XQICKZH4.js → chunk-GENS32QO.js} +10 -8
- package/build/modern/chunk-GENS32QO.js.map +1 -0
- package/build/modern/{chunk-7S47NSGR.js → chunk-H54FR7IP.js} +2 -2
- package/build/modern/chunk-KWZ3CEG6.js +23 -0
- package/build/modern/chunk-KWZ3CEG6.js.map +1 -0
- package/build/modern/{chunk-JWIJHSI6.js → chunk-L7N24B6B.js} +3 -6
- package/build/modern/chunk-L7N24B6B.js.map +1 -0
- package/build/modern/chunk-LT62577B.js +23 -0
- package/build/modern/chunk-LT62577B.js.map +1 -0
- package/build/modern/{chunk-3BM6MZ4A.js → chunk-MWRO5QYD.js} +1 -1
- package/build/modern/chunk-MWRO5QYD.js.map +1 -0
- package/build/modern/{chunk-PZAZKQMO.js → chunk-OYT7RGC7.js} +1 -1
- package/build/modern/chunk-OYT7RGC7.js.map +1 -0
- package/build/modern/{chunk-ILQW5VZT.js → chunk-RBNOEAWJ.js} +4 -7
- package/build/modern/chunk-RBNOEAWJ.js.map +1 -0
- package/build/modern/{chunk-5QONP7GT.js → chunk-S2X5OEPK.js} +2 -10
- package/build/modern/chunk-S2X5OEPK.js.map +1 -0
- package/build/modern/chunk-TIJAFPHQ.js +1 -0
- package/build/modern/chunk-TYPULJMJ.js +1 -0
- package/build/modern/chunk-UNN4LHRS.js +31 -0
- package/build/modern/chunk-UNN4LHRS.js.map +1 -0
- package/build/modern/chunk-VSTOSLFS.js +100 -0
- package/build/modern/chunk-VSTOSLFS.js.map +1 -0
- package/build/modern/chunk-Z52R6ABJ.js +21 -0
- package/build/modern/chunk-Z52R6ABJ.js.map +1 -0
- package/build/modern/{chunk-3RGRHMJQ.js → chunk-ZDANBCM3.js} +2 -2
- package/build/modern/components/AccordionItemGroup.js +1 -1
- package/build/modern/components/DatePicker.client.js +4 -5
- package/build/modern/components/Fieldset.js +1 -2
- package/build/modern/components/FieldsetLabel.js +1 -1
- package/build/modern/components/FileStatus.js +10 -4
- package/build/modern/components/Legend.js +1 -2
- package/build/modern/components/Radio.js +1 -3
- package/build/modern/components/Select.js +1 -2
- package/build/modern/components/Toggle.js +1 -2
- package/build/modern/components/button/button.js +1 -1
- package/build/modern/components/button/index.js +2 -2
- package/build/modern/components/button/parts.js +2 -2
- package/build/modern/components/checkbox/checkbox-icon.js +12 -0
- package/build/modern/components/checkbox/checkbox.js +13 -0
- package/build/modern/components/checkbox/index.js +30 -0
- package/build/modern/components/checkbox/parts.js +8 -0
- package/build/modern/components/checkbox/parts.js.map +1 -0
- package/build/modern/components/checkbox/primitives.js +17 -0
- package/build/modern/components/checkbox/primitives.js.map +1 -0
- package/build/modern/components/deprecated/FieldMessage.js +8 -0
- package/build/modern/components/deprecated/FieldMessage.js.map +1 -0
- package/build/modern/components/deprecated/Label.js +17 -0
- package/build/modern/components/deprecated/Label.js.map +1 -0
- package/build/modern/components/field/field.js +14 -0
- package/build/modern/components/field/field.js.map +1 -0
- package/build/modern/components/field/index.js +44 -0
- package/build/modern/components/field/index.js.map +1 -0
- package/build/modern/components/field/parts.js +11 -0
- package/build/modern/components/field/parts.js.map +1 -0
- package/build/modern/components/field/primitives.js +26 -0
- package/build/modern/components/field/primitives.js.map +1 -0
- package/build/modern/components/field/start-indicator.js +7 -0
- package/build/modern/components/field/start-indicator.js.map +1 -0
- package/build/modern/components/field/status-indicator.js +9 -0
- package/build/modern/components/field/status-indicator.js.map +1 -0
- package/build/modern/components/for.js +7 -0
- package/build/modern/components/for.js.map +1 -0
- package/build/modern/context/confirm-modal.js +3 -3
- package/build/modern/context/cta-modal.js +4 -4
- package/build/modern/context/field.js +34 -4
- package/build/modern/context/field.js.map +1 -1
- package/build/modern/context/notification-center.js +2 -2
- package/build/modern/context/prompt-modal.js +12 -7
- package/build/modern/hooks/useDate.js +1 -1
- package/build/modern/index.js +131 -82
- package/build/modern/index.js.map +1 -1
- package/build/modern/utils/index.js +5 -3
- package/package.json +2 -2
- package/src/components/DatePicker.client.tsx +2 -14
- package/src/components/Fieldset.tsx +3 -3
- package/src/components/FieldsetLabel.tsx +5 -2
- package/src/components/FileStatus.tsx +4 -5
- package/src/components/Legend.tsx +5 -6
- package/src/components/Radio.tsx +2 -7
- package/src/components/Select.tsx +1 -16
- package/src/components/Toggle.tsx +14 -7
- package/src/components/button/button.tsx +1 -1
- package/src/components/button/parts.ts +6 -0
- package/src/components/checkbox/checkbox-icon.tsx +39 -0
- package/src/components/checkbox/checkbox.tsx +48 -0
- package/src/components/checkbox/index.ts +3 -0
- package/src/components/checkbox/parts.ts +59 -0
- package/src/components/checkbox/primitives.tsx +104 -0
- package/src/components/{FieldMessage.tsx → deprecated/FieldMessage.tsx} +2 -13
- package/src/components/deprecated/Label.tsx +24 -0
- package/src/components/field/field.tsx +77 -0
- package/src/components/field/index.ts +5 -0
- package/src/components/field/parts.ts +77 -0
- package/src/components/field/primitives.tsx +204 -0
- package/src/components/field/start-indicator.tsx +23 -0
- package/src/components/field/status-indicator.tsx +58 -0
- package/src/components/for.tsx +43 -0
- package/src/context/field.tsx +6 -5
- package/src/context/prompt-modal.tsx +16 -18
- package/src/hooks/useDate.ts +1 -7
- package/src/index.ts +6 -7
- package/src/utils/index.ts +30 -0
- package/build/legacy/components/Checkbox.cjs +0 -113
- package/build/legacy/components/Checkbox.cjs.map +0 -1
- package/build/legacy/components/FieldMessage.cjs.map +0 -1
- package/build/legacy/components/Input.cjs +0 -95
- package/build/legacy/components/Input.cjs.map +0 -1
- package/build/legacy/components/Label.cjs +0 -93
- package/build/legacy/components/Label.cjs.map +0 -1
- package/build/legacy/components/Textarea.cjs.map +0 -1
- package/build/modern/chunk-2JX27W6Y.js.map +0 -1
- package/build/modern/chunk-3BM6MZ4A.js.map +0 -1
- package/build/modern/chunk-3ZDFQO25.js.map +0 -1
- package/build/modern/chunk-5QONP7GT.js.map +0 -1
- package/build/modern/chunk-7P7OWBGV.js.map +0 -1
- package/build/modern/chunk-C5EHJUS5.js +0 -10
- package/build/modern/chunk-C5EHJUS5.js.map +0 -1
- package/build/modern/chunk-FTPZHG6J.js.map +0 -1
- package/build/modern/chunk-ILQW5VZT.js.map +0 -1
- package/build/modern/chunk-JIJM6JFJ.js +0 -36
- package/build/modern/chunk-JIJM6JFJ.js.map +0 -1
- package/build/modern/chunk-JWIJHSI6.js.map +0 -1
- package/build/modern/chunk-KU2AWAK3.js.map +0 -1
- package/build/modern/chunk-NGOLRISW.js +0 -63
- package/build/modern/chunk-NGOLRISW.js.map +0 -1
- package/build/modern/chunk-NMF2HYWO.js +0 -50
- package/build/modern/chunk-NMF2HYWO.js.map +0 -1
- package/build/modern/chunk-PZAZKQMO.js.map +0 -1
- package/build/modern/chunk-Q4IV5NUT.js.map +0 -1
- package/build/modern/chunk-UZDVOIW5.js +0 -33
- package/build/modern/chunk-UZDVOIW5.js.map +0 -1
- package/build/modern/chunk-VYCU7I4J.js +0 -43
- package/build/modern/chunk-VYCU7I4J.js.map +0 -1
- package/build/modern/chunk-XQICKZH4.js.map +0 -1
- package/build/modern/components/Checkbox.js +0 -11
- package/build/modern/components/FieldMessage.js +0 -9
- package/build/modern/components/Input.js +0 -11
- package/build/modern/components/Label.js +0 -10
- package/build/modern/components/Textarea.js +0 -9
- package/src/components/Checkbox.tsx +0 -93
- package/src/components/Input.tsx +0 -69
- package/src/components/Label.tsx +0 -69
- package/src/components/Textarea.tsx +0 -52
- /package/build/modern/{chunk-Z7FGXAND.js.map → chunk-FMRWRVUS.js.map} +0 -0
- /package/build/modern/{chunk-7S47NSGR.js.map → chunk-H54FR7IP.js.map} +0 -0
- /package/build/modern/{components/Checkbox.js.map → chunk-TIJAFPHQ.js.map} +0 -0
- /package/build/modern/{components/FieldMessage.js.map → chunk-TYPULJMJ.js.map} +0 -0
- /package/build/modern/{chunk-3RGRHMJQ.js.map → chunk-ZDANBCM3.js.map} +0 -0
- /package/build/modern/components/{Input.js.map → checkbox/checkbox-icon.js.map} +0 -0
- /package/build/modern/components/{Label.js.map → checkbox/checkbox.js.map} +0 -0
- /package/build/modern/components/{Textarea.js.map → checkbox/index.js.map} +0 -0
|
@@ -0,0 +1,191 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __defProp = Object.defineProperty;
|
|
3
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
6
|
+
var __export = (target, all) => {
|
|
7
|
+
for (var name in all)
|
|
8
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
9
|
+
};
|
|
10
|
+
var __copyProps = (to, from, except, desc) => {
|
|
11
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
12
|
+
for (let key of __getOwnPropNames(from))
|
|
13
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
14
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
15
|
+
}
|
|
16
|
+
return to;
|
|
17
|
+
};
|
|
18
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
19
|
+
|
|
20
|
+
// src/components/field/primitives.tsx
|
|
21
|
+
var primitives_exports = {};
|
|
22
|
+
__export(primitives_exports, {
|
|
23
|
+
FieldErrorText: () => FieldErrorText,
|
|
24
|
+
FieldHelperText: () => FieldHelperText,
|
|
25
|
+
FieldInput: () => FieldInput,
|
|
26
|
+
FieldLabel: () => FieldLabel,
|
|
27
|
+
FieldRequiredIndicator: () => FieldRequiredIndicator,
|
|
28
|
+
FieldRoot: () => FieldRoot,
|
|
29
|
+
FieldTextarea: () => FieldTextarea,
|
|
30
|
+
Input: () => Input,
|
|
31
|
+
Textarea: () => Textarea
|
|
32
|
+
});
|
|
33
|
+
module.exports = __toCommonJS(primitives_exports);
|
|
34
|
+
var import_field = require("@ark-ui/react/field");
|
|
35
|
+
var import_css3 = require("@cerberus/styled-system/css");
|
|
36
|
+
var import_recipes3 = require("@cerberus/styled-system/recipes");
|
|
37
|
+
|
|
38
|
+
// src/components/field/status-indicator.tsx
|
|
39
|
+
var import_react2 = require("@ark-ui/react");
|
|
40
|
+
var import_css = require("@cerberus/styled-system/css");
|
|
41
|
+
var import_recipes = require("@cerberus/styled-system/recipes");
|
|
42
|
+
|
|
43
|
+
// src/context/cerberus.tsx
|
|
44
|
+
var import_react = require("react");
|
|
45
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
|
46
|
+
var CerberusContext = (0, import_react.createContext)(null);
|
|
47
|
+
function useCerberusContext() {
|
|
48
|
+
const context = (0, import_react.useContext)(CerberusContext);
|
|
49
|
+
if (!context) {
|
|
50
|
+
throw new Error("useCerberus must be used within a CerberusProvider");
|
|
51
|
+
}
|
|
52
|
+
return context;
|
|
53
|
+
}
|
|
54
|
+
|
|
55
|
+
// src/components/field/status-indicator.tsx
|
|
56
|
+
var import_jsx_runtime2 = require("react/jsx-runtime");
|
|
57
|
+
function FieldStatusIndicator(props) {
|
|
58
|
+
const { fallback, ...nativeProps } = props;
|
|
59
|
+
const styles = (0, import_recipes.field)();
|
|
60
|
+
const fieldContext = (0, import_react2.useFieldContext)();
|
|
61
|
+
const { icons } = useCerberusContext();
|
|
62
|
+
const { invalid: InvalidIcon } = icons;
|
|
63
|
+
if (fieldContext.invalid) {
|
|
64
|
+
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
65
|
+
"span",
|
|
66
|
+
{
|
|
67
|
+
...nativeProps,
|
|
68
|
+
"aria-hidden": "true",
|
|
69
|
+
"data-invalid": true,
|
|
70
|
+
className: (0, import_css.cx)(nativeProps.className, styles.statusIndicator),
|
|
71
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(InvalidIcon, {})
|
|
72
|
+
}
|
|
73
|
+
);
|
|
74
|
+
}
|
|
75
|
+
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
76
|
+
"span",
|
|
77
|
+
{
|
|
78
|
+
...nativeProps,
|
|
79
|
+
"aria-hidden": "true",
|
|
80
|
+
"data-part": "end-indicator",
|
|
81
|
+
className: (0, import_css.cx)(nativeProps.className, styles.endIndicator),
|
|
82
|
+
children: fallback
|
|
83
|
+
}
|
|
84
|
+
);
|
|
85
|
+
}
|
|
86
|
+
|
|
87
|
+
// src/components/field/start-indicator.tsx
|
|
88
|
+
var import_css2 = require("@cerberus/styled-system/css");
|
|
89
|
+
var import_recipes2 = require("@cerberus/styled-system/recipes");
|
|
90
|
+
var import_jsx_runtime3 = require("react/jsx-runtime");
|
|
91
|
+
function FieldStartIndicator(props) {
|
|
92
|
+
const styles = (0, import_recipes2.field)();
|
|
93
|
+
if (!props.children) return null;
|
|
94
|
+
return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
95
|
+
"span",
|
|
96
|
+
{
|
|
97
|
+
...props,
|
|
98
|
+
"data-part": "start-indicator",
|
|
99
|
+
className: (0, import_css2.cx)(props.className, styles.startIndicator)
|
|
100
|
+
}
|
|
101
|
+
);
|
|
102
|
+
}
|
|
103
|
+
|
|
104
|
+
// src/components/field/primitives.tsx
|
|
105
|
+
var import_jsx_runtime4 = require("react/jsx-runtime");
|
|
106
|
+
function FieldRoot(props) {
|
|
107
|
+
const { size, ...fieldProps } = props;
|
|
108
|
+
const styles = (0, import_recipes3.field)({ size });
|
|
109
|
+
return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
110
|
+
import_field.Field.Root,
|
|
111
|
+
{
|
|
112
|
+
...fieldProps,
|
|
113
|
+
className: (0, import_css3.cx)(styles.root, fieldProps.className)
|
|
114
|
+
}
|
|
115
|
+
);
|
|
116
|
+
}
|
|
117
|
+
function FieldLabel(props) {
|
|
118
|
+
const { children, ...nativeProps } = props;
|
|
119
|
+
const styles = (0, import_recipes3.field)();
|
|
120
|
+
return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_field.Field.Label, { ...nativeProps, className: (0, import_css3.cx)(styles.label, props.className), children: [
|
|
121
|
+
children,
|
|
122
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_field.Field.RequiredIndicator, { children: "(required)" })
|
|
123
|
+
] });
|
|
124
|
+
}
|
|
125
|
+
function FieldRequiredIndicator() {
|
|
126
|
+
return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_field.Field.RequiredIndicator, { children: "(required)" });
|
|
127
|
+
}
|
|
128
|
+
function FieldInput(props) {
|
|
129
|
+
const { size, startIcon, endIcon, ...fieldProps } = props;
|
|
130
|
+
const styles = (0, import_recipes3.field)({ size });
|
|
131
|
+
const hasStartIcon = Boolean(startIcon);
|
|
132
|
+
return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: styles.inputRoot, children: [
|
|
133
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(FieldStartIndicator, { children: startIcon }),
|
|
134
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
135
|
+
import_field.Field.Input,
|
|
136
|
+
{
|
|
137
|
+
...fieldProps,
|
|
138
|
+
...hasStartIcon && { "data-has": "start-indicator" },
|
|
139
|
+
className: (0, import_css3.cx)(styles.input, fieldProps.className)
|
|
140
|
+
}
|
|
141
|
+
),
|
|
142
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(FieldStatusIndicator, { fallback: endIcon })
|
|
143
|
+
] });
|
|
144
|
+
}
|
|
145
|
+
function FieldHelperText(props) {
|
|
146
|
+
const styles = (0, import_recipes3.field)();
|
|
147
|
+
if (!props.children) return null;
|
|
148
|
+
return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
149
|
+
import_field.Field.HelperText,
|
|
150
|
+
{
|
|
151
|
+
...props,
|
|
152
|
+
className: (0, import_css3.cx)(styles.helperText, props.className)
|
|
153
|
+
}
|
|
154
|
+
);
|
|
155
|
+
}
|
|
156
|
+
function FieldErrorText(props) {
|
|
157
|
+
const styles = (0, import_recipes3.field)();
|
|
158
|
+
if (!props.children) return null;
|
|
159
|
+
return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
160
|
+
import_field.Field.ErrorText,
|
|
161
|
+
{
|
|
162
|
+
...props,
|
|
163
|
+
className: (0, import_css3.cx)(styles.errorText, props.className)
|
|
164
|
+
}
|
|
165
|
+
);
|
|
166
|
+
}
|
|
167
|
+
function FieldTextarea(props) {
|
|
168
|
+
const styles = (0, import_recipes3.field)();
|
|
169
|
+
return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
170
|
+
import_field.Field.Textarea,
|
|
171
|
+
{
|
|
172
|
+
...props,
|
|
173
|
+
className: (0, import_css3.cx)(styles.textarea, props.className)
|
|
174
|
+
}
|
|
175
|
+
);
|
|
176
|
+
}
|
|
177
|
+
var Input = FieldInput;
|
|
178
|
+
var Textarea = FieldTextarea;
|
|
179
|
+
// Annotate the CommonJS export names for ESM import in node:
|
|
180
|
+
0 && (module.exports = {
|
|
181
|
+
FieldErrorText,
|
|
182
|
+
FieldHelperText,
|
|
183
|
+
FieldInput,
|
|
184
|
+
FieldLabel,
|
|
185
|
+
FieldRequiredIndicator,
|
|
186
|
+
FieldRoot,
|
|
187
|
+
FieldTextarea,
|
|
188
|
+
Input,
|
|
189
|
+
Textarea
|
|
190
|
+
});
|
|
191
|
+
//# sourceMappingURL=primitives.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/field/primitives.tsx","../../../../src/components/field/status-indicator.tsx","../../../../src/context/cerberus.tsx","../../../../src/components/field/start-indicator.tsx"],"sourcesContent":["import {\n Field,\n type FieldHelperTextProps,\n type FieldInputProps as ArkFieldInputProps,\n type FieldLabelProps,\n type FieldRootProps as ArkFieldRootProps,\n type FieldTextareaProps,\n} from '@ark-ui/react/field'\nimport type { ReactNode } from 'react'\nimport { cx } from '@cerberus/styled-system/css'\nimport { field, type FieldVariantProps } from '@cerberus/styled-system/recipes'\nimport { FieldStatusIndicator } from './status-indicator'\nimport { FieldStartIndicator } from './start-indicator'\n\n/**\n * This module contains all the primitives of the Field component.\n * @module 'field'\n */\n\nexport type FieldRootProps = ArkFieldRootProps & FieldVariantProps\n\n/**\n * The context & container for the Field components.\n * @description [Field Docs](https://cerberus.digitalu.design/react/field)\n * @example\n * ```tsx\n * <FieldRoot required ids={{ input: 'exampleId' }}>\n * <FieldLabel>Label</FieldLabel>\n * <FieldInput />\n * </FieldRoot>\n * ```\n */\nexport function FieldRoot(props: FieldRootProps) {\n const { size, ...fieldProps } = props\n const styles = field({ size })\n return (\n <Field.Root\n {...fieldProps}\n className={cx(styles.root, fieldProps.className)}\n />\n )\n}\n\n/**\n * The label for the Field component.\n * @description [Field Docs](https://cerberus.digitalu.design/react/field)\n * @example\n * ```tsx\n * <FieldRoot>\n * <FieldLabel>Label</FieldLabel>\n * </FieldRoot>\n * ```\n */\nexport function FieldLabel(props: FieldLabelProps) {\n const { children, ...nativeProps } = props\n const styles = field()\n return (\n <Field.Label {...nativeProps} className={cx(styles.label, props.className)}>\n {children}\n <Field.RequiredIndicator>(required)</Field.RequiredIndicator>\n </Field.Label>\n )\n}\n\n/**\n * The required indicator for the Field component.\n */\nexport function FieldRequiredIndicator() {\n return <Field.RequiredIndicator>(required)</Field.RequiredIndicator>\n}\n\nexport interface FieldInputProps\n extends Omit<ArkFieldInputProps, 'size'>,\n FieldVariantProps {\n /**\n * An optional icon to display at the start of the input.\n */\n startIcon?: ReactNode\n /**\n * An optional icon to display at the end of the input.\n */\n endIcon?: ReactNode\n}\n\n/**\n * The input for the Field component.\n * @description [Field Docs](https://cerberus.digitalu.design/react/field)\n * @example\n * ```tsx\n * <FieldRoot>\n * <FieldInput />\n * </FieldRoot>\n * ```\n */\nexport function FieldInput(props: FieldInputProps) {\n const { size, startIcon, endIcon, ...fieldProps } = props\n const styles = field({ size })\n const hasStartIcon = Boolean(startIcon)\n\n return (\n <div className={styles.inputRoot}>\n <FieldStartIndicator>{startIcon}</FieldStartIndicator>\n <Field.Input\n {...fieldProps}\n {...(hasStartIcon && { 'data-has': 'start-indicator' })}\n className={cx(styles.input, fieldProps.className)}\n />\n <FieldStatusIndicator fallback={endIcon} />\n </div>\n )\n}\n\n/**\n * The helper text for the Field component that is shown when the field is\n * valid.\n * @description [Field Docs](https://cerberus.digitalu.design/react/field)\n * @example\n * ```tsx\n * <FieldRoot>\n * <FieldInput />\n * <FieldHelperText>Helper text</FieldHelperText>\n * </FieldRoot>\n * ```\n */\nexport function FieldHelperText(props: FieldHelperTextProps) {\n const styles = field()\n\n if (!props.children) return null\n\n return (\n <Field.HelperText\n {...props}\n className={cx(styles.helperText, props.className)}\n />\n )\n}\n\n/**\n * The error text for the Field component that is shown when the field is\n * invalid.\n * @description [Field Docs](https://cerberus.digitalu.design/react/field)\n * @example\n * ```tsx\n * <FieldRoot>\n * <FieldInput />\n * <FieldErrorText>Error text</FieldErrorText>\n * </FieldRoot>\n * ```\n */\nexport function FieldErrorText(props: FieldHelperTextProps) {\n const styles = field()\n\n if (!props.children) return null\n\n return (\n <Field.ErrorText\n {...props}\n className={cx(styles.errorText, props.className)}\n />\n )\n}\n\n/**\n * The textarea for the Field component.\n * @description [Field Docs](https://cerberus.digitalu.design/react/field)\n * @example\n * ```tsx\n * <FieldRoot>\n * <FieldTextarea />\n * </FieldRoot>\n * ```\n */\nexport function FieldTextarea(props: FieldTextareaProps) {\n const styles = field()\n return (\n <Field.Textarea\n {...props}\n className={cx(styles.textarea, props.className)}\n />\n )\n}\n\n/**\n * A named export for the FieldInput component.\n * @description [Field Docs](https://cerberus.digitalu.design/react/field)\n * @example\n * ```tsx\n * import { Input } from '@cerberus/react'\n *\n * <Field\n * ids={{\n * control: 'email',\n * }}\n * label=\"Enter your email\"\n * helperText=\"We'll never share your email with anyone else.\"\n * errorText=\"Email is required.\"\n * required\n * >\n * <Input type=\"email\" />\n * </Field>\n * ```\n */\nexport const Input = FieldInput\nexport const Textarea = FieldTextarea\n","'use client'\n\nimport { useFieldContext } from '@ark-ui/react'\nimport { cx } from '@cerberus/styled-system/css'\nimport { field } from '@cerberus/styled-system/recipes'\nimport { useCerberusContext } from '../../context/cerberus'\nimport type { HTMLAttributes, ReactNode } from 'react'\n\nexport interface FieldStatusIndicatorProps\n extends HTMLAttributes<HTMLSpanElement> {\n /**\n * The fallback content to display when the field is valid.\n */\n fallback?: ReactNode\n}\n\n/**\n * The invalid status indicator for the Field component.\n * @description [Field Docs](https://cerberus.digitalu.design/react/field)\n * @example\n * ```tsx\n * <FieldRoot>\n * <FieldStatusIndicator />\n * </FieldRoot>\n * ```\n */\nexport function FieldStatusIndicator(props: FieldStatusIndicatorProps) {\n const { fallback, ...nativeProps } = props\n const styles = field()\n const fieldContext = useFieldContext()\n\n const { icons } = useCerberusContext()\n const { invalid: InvalidIcon } = icons\n\n if (fieldContext.invalid) {\n return (\n <span\n {...nativeProps}\n aria-hidden=\"true\"\n data-invalid\n className={cx(nativeProps.className, styles.statusIndicator)}\n >\n <InvalidIcon />\n </span>\n )\n }\n\n return (\n <span\n {...nativeProps}\n aria-hidden=\"true\"\n data-part=\"end-indicator\"\n className={cx(nativeProps.className, styles.endIndicator)}\n >\n {fallback}\n </span>\n )\n}\n","'use client'\n\nimport { createContext, useContext, type PropsWithChildren } from 'react'\nimport type { SystemConfig } from '../config'\n\n/**\n * This module contains the Cerberus configuration context and helpers.\n * @module context/cerberus\n */\n\ntype CerberusContextValue = SystemConfig\n\nconst CerberusContext = createContext<CerberusContextValue | null>(null)\n\ninterface CerberusProviderProps {\n config: SystemConfig\n}\n\n/**\n * Cerberus configuration provider.\n * @param props.config The Cerberus configuration created with\n * `makeSystemConfig` helper.\n */\nexport function CerberusProvider(\n props: PropsWithChildren<CerberusProviderProps>,\n) {\n return (\n <CerberusContext.Provider value={props.config}>\n {props.children}\n </CerberusContext.Provider>\n )\n}\n\n/**\n * Returns the Cerberus configuration context.\n * @returns The Cerberus configuration context.\n */\nexport function useCerberusContext() {\n const context = useContext(CerberusContext)\n if (!context) {\n throw new Error('useCerberus must be used within a CerberusProvider')\n }\n return context\n}\n","import { cx } from '@cerberus/styled-system/css'\nimport { field } from '@cerberus/styled-system/recipes'\nimport type { HTMLAttributes } from 'react'\n\nexport type FieldIndicatorProps = HTMLAttributes<HTMLSpanElement>\n\n/**\n * The start indicator displays an indicator at the start of the Input.\n * @description [Field Docs](https://cerberus.digitalu.design/react/field)\n */\nexport function FieldStartIndicator(props: FieldIndicatorProps) {\n const styles = field()\n\n if (!props.children) return null\n\n return (\n <span\n {...props}\n data-part=\"start-indicator\"\n className={cx(props.className, styles.startIndicator)}\n />\n )\n}\n"],"mappings":"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","names":["import_css","import_recipes","import_react","import_jsx_runtime","import_css","import_recipes","import_jsx_runtime","import_jsx_runtime"]}
|
|
@@ -0,0 +1,45 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __defProp = Object.defineProperty;
|
|
3
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
6
|
+
var __export = (target, all) => {
|
|
7
|
+
for (var name in all)
|
|
8
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
9
|
+
};
|
|
10
|
+
var __copyProps = (to, from, except, desc) => {
|
|
11
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
12
|
+
for (let key of __getOwnPropNames(from))
|
|
13
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
14
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
15
|
+
}
|
|
16
|
+
return to;
|
|
17
|
+
};
|
|
18
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
19
|
+
|
|
20
|
+
// src/components/field/start-indicator.tsx
|
|
21
|
+
var start_indicator_exports = {};
|
|
22
|
+
__export(start_indicator_exports, {
|
|
23
|
+
FieldStartIndicator: () => FieldStartIndicator
|
|
24
|
+
});
|
|
25
|
+
module.exports = __toCommonJS(start_indicator_exports);
|
|
26
|
+
var import_css = require("@cerberus/styled-system/css");
|
|
27
|
+
var import_recipes = require("@cerberus/styled-system/recipes");
|
|
28
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
|
29
|
+
function FieldStartIndicator(props) {
|
|
30
|
+
const styles = (0, import_recipes.field)();
|
|
31
|
+
if (!props.children) return null;
|
|
32
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
33
|
+
"span",
|
|
34
|
+
{
|
|
35
|
+
...props,
|
|
36
|
+
"data-part": "start-indicator",
|
|
37
|
+
className: (0, import_css.cx)(props.className, styles.startIndicator)
|
|
38
|
+
}
|
|
39
|
+
);
|
|
40
|
+
}
|
|
41
|
+
// Annotate the CommonJS export names for ESM import in node:
|
|
42
|
+
0 && (module.exports = {
|
|
43
|
+
FieldStartIndicator
|
|
44
|
+
});
|
|
45
|
+
//# sourceMappingURL=start-indicator.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/field/start-indicator.tsx"],"sourcesContent":["import { cx } from '@cerberus/styled-system/css'\nimport { field } from '@cerberus/styled-system/recipes'\nimport type { HTMLAttributes } from 'react'\n\nexport type FieldIndicatorProps = HTMLAttributes<HTMLSpanElement>\n\n/**\n * The start indicator displays an indicator at the start of the Input.\n * @description [Field Docs](https://cerberus.digitalu.design/react/field)\n */\nexport function FieldStartIndicator(props: FieldIndicatorProps) {\n const styles = field()\n\n if (!props.children) return null\n\n return (\n <span\n {...props}\n data-part=\"start-indicator\"\n className={cx(props.className, styles.startIndicator)}\n />\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,iBAAmB;AACnB,qBAAsB;AAelB;AANG,SAAS,oBAAoB,OAA4B;AAC9D,QAAM,aAAS,sBAAM;AAErB,MAAI,CAAC,MAAM,SAAU,QAAO;AAE5B,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ,aAAU;AAAA,MACV,eAAW,eAAG,MAAM,WAAW,OAAO,cAAc;AAAA;AAAA,EACtD;AAEJ;","names":[]}
|
|
@@ -0,0 +1,78 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
"use client";
|
|
3
|
+
var __defProp = Object.defineProperty;
|
|
4
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
6
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
|
+
var __export = (target, all) => {
|
|
8
|
+
for (var name in all)
|
|
9
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
10
|
+
};
|
|
11
|
+
var __copyProps = (to, from, except, desc) => {
|
|
12
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
13
|
+
for (let key of __getOwnPropNames(from))
|
|
14
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
15
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
16
|
+
}
|
|
17
|
+
return to;
|
|
18
|
+
};
|
|
19
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
20
|
+
|
|
21
|
+
// src/components/field/status-indicator.tsx
|
|
22
|
+
var status_indicator_exports = {};
|
|
23
|
+
__export(status_indicator_exports, {
|
|
24
|
+
FieldStatusIndicator: () => FieldStatusIndicator
|
|
25
|
+
});
|
|
26
|
+
module.exports = __toCommonJS(status_indicator_exports);
|
|
27
|
+
var import_react2 = require("@ark-ui/react");
|
|
28
|
+
var import_css = require("@cerberus/styled-system/css");
|
|
29
|
+
var import_recipes = require("@cerberus/styled-system/recipes");
|
|
30
|
+
|
|
31
|
+
// src/context/cerberus.tsx
|
|
32
|
+
var import_react = require("react");
|
|
33
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
|
34
|
+
var CerberusContext = (0, import_react.createContext)(null);
|
|
35
|
+
function useCerberusContext() {
|
|
36
|
+
const context = (0, import_react.useContext)(CerberusContext);
|
|
37
|
+
if (!context) {
|
|
38
|
+
throw new Error("useCerberus must be used within a CerberusProvider");
|
|
39
|
+
}
|
|
40
|
+
return context;
|
|
41
|
+
}
|
|
42
|
+
|
|
43
|
+
// src/components/field/status-indicator.tsx
|
|
44
|
+
var import_jsx_runtime2 = require("react/jsx-runtime");
|
|
45
|
+
function FieldStatusIndicator(props) {
|
|
46
|
+
const { fallback, ...nativeProps } = props;
|
|
47
|
+
const styles = (0, import_recipes.field)();
|
|
48
|
+
const fieldContext = (0, import_react2.useFieldContext)();
|
|
49
|
+
const { icons } = useCerberusContext();
|
|
50
|
+
const { invalid: InvalidIcon } = icons;
|
|
51
|
+
if (fieldContext.invalid) {
|
|
52
|
+
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
53
|
+
"span",
|
|
54
|
+
{
|
|
55
|
+
...nativeProps,
|
|
56
|
+
"aria-hidden": "true",
|
|
57
|
+
"data-invalid": true,
|
|
58
|
+
className: (0, import_css.cx)(nativeProps.className, styles.statusIndicator),
|
|
59
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(InvalidIcon, {})
|
|
60
|
+
}
|
|
61
|
+
);
|
|
62
|
+
}
|
|
63
|
+
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
64
|
+
"span",
|
|
65
|
+
{
|
|
66
|
+
...nativeProps,
|
|
67
|
+
"aria-hidden": "true",
|
|
68
|
+
"data-part": "end-indicator",
|
|
69
|
+
className: (0, import_css.cx)(nativeProps.className, styles.endIndicator),
|
|
70
|
+
children: fallback
|
|
71
|
+
}
|
|
72
|
+
);
|
|
73
|
+
}
|
|
74
|
+
// Annotate the CommonJS export names for ESM import in node:
|
|
75
|
+
0 && (module.exports = {
|
|
76
|
+
FieldStatusIndicator
|
|
77
|
+
});
|
|
78
|
+
//# sourceMappingURL=status-indicator.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/field/status-indicator.tsx","../../../../src/context/cerberus.tsx"],"sourcesContent":["'use client'\n\nimport { useFieldContext } from '@ark-ui/react'\nimport { cx } from '@cerberus/styled-system/css'\nimport { field } from '@cerberus/styled-system/recipes'\nimport { useCerberusContext } from '../../context/cerberus'\nimport type { HTMLAttributes, ReactNode } from 'react'\n\nexport interface FieldStatusIndicatorProps\n extends HTMLAttributes<HTMLSpanElement> {\n /**\n * The fallback content to display when the field is valid.\n */\n fallback?: ReactNode\n}\n\n/**\n * The invalid status indicator for the Field component.\n * @description [Field Docs](https://cerberus.digitalu.design/react/field)\n * @example\n * ```tsx\n * <FieldRoot>\n * <FieldStatusIndicator />\n * </FieldRoot>\n * ```\n */\nexport function FieldStatusIndicator(props: FieldStatusIndicatorProps) {\n const { fallback, ...nativeProps } = props\n const styles = field()\n const fieldContext = useFieldContext()\n\n const { icons } = useCerberusContext()\n const { invalid: InvalidIcon } = icons\n\n if (fieldContext.invalid) {\n return (\n <span\n {...nativeProps}\n aria-hidden=\"true\"\n data-invalid\n className={cx(nativeProps.className, styles.statusIndicator)}\n >\n <InvalidIcon />\n </span>\n )\n }\n\n return (\n <span\n {...nativeProps}\n aria-hidden=\"true\"\n data-part=\"end-indicator\"\n className={cx(nativeProps.className, styles.endIndicator)}\n >\n {fallback}\n </span>\n )\n}\n","'use client'\n\nimport { createContext, useContext, type PropsWithChildren } from 'react'\nimport type { SystemConfig } from '../config'\n\n/**\n * This module contains the Cerberus configuration context and helpers.\n * @module context/cerberus\n */\n\ntype CerberusContextValue = SystemConfig\n\nconst CerberusContext = createContext<CerberusContextValue | null>(null)\n\ninterface CerberusProviderProps {\n config: SystemConfig\n}\n\n/**\n * Cerberus configuration provider.\n * @param props.config The Cerberus configuration created with\n * `makeSystemConfig` helper.\n */\nexport function CerberusProvider(\n props: PropsWithChildren<CerberusProviderProps>,\n) {\n return (\n <CerberusContext.Provider value={props.config}>\n {props.children}\n </CerberusContext.Provider>\n )\n}\n\n/**\n * Returns the Cerberus configuration context.\n * @returns The Cerberus configuration context.\n */\nexport function useCerberusContext() {\n const context = useContext(CerberusContext)\n if (!context) {\n throw new Error('useCerberus must be used within a CerberusProvider')\n }\n return context\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,IAAAA,gBAAgC;AAChC,iBAAmB;AACnB,qBAAsB;;;ACFtB,mBAAkE;AAyB9D;AAfJ,IAAM,sBAAkB,4BAA2C,IAAI;AAyBhE,SAAS,qBAAqB;AACnC,QAAM,cAAU,yBAAW,eAAe;AAC1C,MAAI,CAAC,SAAS;AACZ,UAAM,IAAI,MAAM,oDAAoD;AAAA,EACtE;AACA,SAAO;AACT;;;ADDQ,IAAAC,sBAAA;AAhBD,SAAS,qBAAqB,OAAkC;AACrE,QAAM,EAAE,UAAU,GAAG,YAAY,IAAI;AACrC,QAAM,aAAS,sBAAM;AACrB,QAAM,mBAAe,+BAAgB;AAErC,QAAM,EAAE,MAAM,IAAI,mBAAmB;AACrC,QAAM,EAAE,SAAS,YAAY,IAAI;AAEjC,MAAI,aAAa,SAAS;AACxB,WACE;AAAA,MAAC;AAAA;AAAA,QACE,GAAG;AAAA,QACJ,eAAY;AAAA,QACZ,gBAAY;AAAA,QACZ,eAAW,eAAG,YAAY,WAAW,OAAO,eAAe;AAAA,QAE3D,uDAAC,eAAY;AAAA;AAAA,IACf;AAAA,EAEJ;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ,eAAY;AAAA,MACZ,aAAU;AAAA,MACV,eAAW,eAAG,YAAY,WAAW,OAAO,YAAY;AAAA,MAEvD;AAAA;AAAA,EACH;AAEJ;","names":["import_react","import_jsx_runtime"]}
|
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __defProp = Object.defineProperty;
|
|
3
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
6
|
+
var __export = (target, all) => {
|
|
7
|
+
for (var name in all)
|
|
8
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
9
|
+
};
|
|
10
|
+
var __copyProps = (to, from, except, desc) => {
|
|
11
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
12
|
+
for (let key of __getOwnPropNames(from))
|
|
13
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
14
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
15
|
+
}
|
|
16
|
+
return to;
|
|
17
|
+
};
|
|
18
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
19
|
+
|
|
20
|
+
// src/components/for.tsx
|
|
21
|
+
var for_exports = {};
|
|
22
|
+
__export(for_exports, {
|
|
23
|
+
For: () => For
|
|
24
|
+
});
|
|
25
|
+
module.exports = __toCommonJS(for_exports);
|
|
26
|
+
function For(props) {
|
|
27
|
+
var _a, _b;
|
|
28
|
+
const mappableChildren = props.children;
|
|
29
|
+
if (((_a = props.each) == null ? void 0 : _a.length) === 0) {
|
|
30
|
+
return props.fallback || null;
|
|
31
|
+
}
|
|
32
|
+
return (_b = props.each) == null ? void 0 : _b.map(mappableChildren);
|
|
33
|
+
}
|
|
34
|
+
// Annotate the CommonJS export names for ESM import in node:
|
|
35
|
+
0 && (module.exports = {
|
|
36
|
+
For
|
|
37
|
+
});
|
|
38
|
+
//# sourceMappingURL=for.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/components/for.tsx"],"sourcesContent":["import type { ReactNode } from 'react'\n\nexport interface ForProps<T> {\n /**\n * The array to iterate over\n */\n each: T[]\n /**\n * The fallback content to render when the array is empty\n */\n fallback?: ReactNode\n /**\n * The render function to render each item in the array\n */\n children: (item: Exclude<T, undefined>, index: number) => ReactNode\n}\n\n/**\n * The For component is used to iterate over an array and render a list of\n * components or display a fallback when the array is empty.\n * Inspired by the `<For>` component from SolidJS.\n *\n * @example\n * ```tsx\n * <For each={['a', 'b', 'c']}>\n * {(item, index) => <div key={index}>{item}</div>}\n * </For>\n * ```\n */\nexport function For<\n T extends string | number | Record<string, unknown> | undefined,\n>(props: ForProps<T>) {\n const mappableChildren = props.children as unknown as (\n item: T,\n index: number,\n ) => ReactNode\n\n if (props.each?.length === 0) {\n return props.fallback || null\n }\n\n return props.each?.map(mappableChildren) as ReactNode\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AA6BO,SAAS,IAEd,OAAoB;AA/BtB;AAgCE,QAAM,mBAAmB,MAAM;AAK/B,QAAI,WAAM,SAAN,mBAAY,YAAW,GAAG;AAC5B,WAAO,MAAM,YAAY;AAAA,EAC3B;AAEA,UAAO,WAAM,SAAN,mBAAY,IAAI;AACzB;","names":[]}
|
|
@@ -31,6 +31,7 @@ var import_react6 = require("react");
|
|
|
31
31
|
var import_react2 = require("react");
|
|
32
32
|
var import_css = require("@cerberus/styled-system/css");
|
|
33
33
|
var import_recipes = require("@cerberus/styled-system/recipes");
|
|
34
|
+
var import_jsx = require("@cerberus/styled-system/jsx");
|
|
34
35
|
|
|
35
36
|
// src/components/Show.tsx
|
|
36
37
|
var import_react = require("react");
|
|
@@ -44,7 +45,6 @@ function Show(props) {
|
|
|
44
45
|
}
|
|
45
46
|
|
|
46
47
|
// src/components/button/button.tsx
|
|
47
|
-
var import_jsx = require("@cerberus/styled-system/jsx");
|
|
48
48
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
49
49
|
var ButtonContext = (0, import_react2.createContext)({
|
|
50
50
|
pending: false
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/context/confirm-modal.tsx","../../../src/components/button/button.tsx","../../../src/components/Show.tsx","../../../src/components/Avatar.tsx","../../../src/context/cerberus.tsx","../../../src/components/Dialog.tsx","../../../src/components/Portal.tsx"],"sourcesContent":["'use client'\n\nimport {\n createContext,\n useCallback,\n useContext,\n useMemo,\n useRef,\n useState,\n type MouseEvent,\n type PropsWithChildren,\n type ReactNode,\n} from 'react'\nimport { Button } from '../components/button/button'\nimport { css } from '@cerberus/styled-system/css'\nimport { Show } from '../components/Show'\nimport { Avatar } from '../components/Avatar'\nimport { HStack, VStack } from '@cerberus/styled-system/jsx'\nimport { useCerberusContext } from './cerberus'\nimport {\n Dialog,\n DialogCloseTrigger,\n DialogDescription,\n DialogHeading,\n DialogProvider,\n} from '../components/Dialog'\n\n/**\n * This module provides a context and hook for the confirm modal.\n * @module\n */\n\nexport interface BaseConfirmOptions {\n /**\n * The heading of the confirm modal.\n */\n heading: string\n /**\n * The text for the action button.\n */\n actionText: string\n /**\n * The text for the cancel button.\n */\n cancelText: string\n}\n\nexport interface DestructiveConfirmOptions extends BaseConfirmOptions {\n /**\n * The kind of confirm modal to show.\n */\n kind?: 'destructive'\n /**\n * The description of the confirm modal. Can only be a string for destructive confirm modals.\n */\n description?: string\n}\n\nexport interface NonDestructiveConfirmModalOptions extends BaseConfirmOptions {\n /**\n * The kind of confirm modal to show.\n * @default 'non-destructive'\n */\n kind?: 'non-destructive'\n /**\n * The description of the confirm modal. Can be a ReactNode for non-destructive kind if you need to display text links.\n * @example\n * ```tsx\n * description: <>Use a Fragment because we put the content within a Paragraph tag.</>\n */\n description?: ReactNode\n}\n\nexport type ShowConfirmModalOptions =\n | NonDestructiveConfirmModalOptions\n | DestructiveConfirmOptions\n\nexport type ShowResult =\n | ((value: boolean | PromiseLike<boolean>) => void)\n | null\n\nexport interface ConfirmModalValue {\n show: (options: ShowConfirmModalOptions) => Promise<boolean>\n}\n\nconst ConfirmModalContext = createContext<ConfirmModalValue | null>(null)\n\nexport type ConfirmModalProviderProps = PropsWithChildren<unknown>\n\n/**\n * Provides a confirm modal to the app.\n * @see https://cerberus.digitalu.design/react/confirm-modal\n * @example\n * ```tsx\n * // Wrap the Provider around the root of the feature.\n * <ConfirmModal>\n * <SomeFeatureSection />\n * </ConfirmModal>\n *\n * // Use the hook to show the confirm modal.\n * const confirm = useConfirmModal()\n *\n * const handleClick = useCallback(async () => {\n * const userConsent = await confirm.show({\n * heading: 'Add new payment method?',\n * description:\n * 'This will add a new payment method to your account to be billed for future purchases.',\n * actionText: 'Yes, add payment method',\n * cancelText: 'No, cancel',\n * })\n * setConsent(userConsent)\n * }, [confirm])\n * ```\n */\nexport function ConfirmModal(\n props: PropsWithChildren<ConfirmModalProviderProps>,\n) {\n const [open, setOpen] = useState<boolean>(false)\n const [content, setContent] = useState<ShowConfirmModalOptions | null>(null)\n const resolveRef = useRef<ShowResult>(null)\n const kind = content?.kind ?? 'non-destructive'\n\n const { icons } = useCerberusContext()\n const { confirmModal: ConfirmIcon } = icons\n\n const palette = useMemo(\n () => (kind === 'destructive' ? 'danger' : 'action'),\n [kind],\n )\n\n const handleChoice = useCallback(\n (e: MouseEvent<HTMLButtonElement>) => {\n const target = e.currentTarget as HTMLButtonElement\n if (target.value === 'true') {\n resolveRef.current?.(true)\n }\n resolveRef.current?.(false)\n setOpen(false)\n },\n [setOpen],\n )\n\n const handleShow = useCallback(\n (options: ShowConfirmModalOptions) => {\n return new Promise<boolean>((resolve) => {\n setContent({ ...options })\n setOpen(true)\n resolveRef.current = resolve\n })\n },\n [setOpen, setContent],\n )\n\n const value = useMemo(\n () => ({\n show: handleShow,\n }),\n [handleShow],\n )\n\n return (\n <ConfirmModalContext.Provider value={value}>\n {props.children}\n\n <DialogProvider open={open} onOpenChange={(e) => setOpen(e.open)}>\n <Dialog size=\"sm\">\n <VStack gap=\"xl\" w=\"full\">\n <VStack alignItems=\"flex-start\" gap=\"md\" w=\"full\">\n <HStack\n alignSelf=\"center\"\n justify=\"center\"\n paddingBlockEnd=\"md\"\n w=\"full\"\n >\n <Show\n when={palette === 'danger'}\n fallback={\n <Avatar\n ariaLabel=\"\"\n gradient=\"charon-light\"\n icon={<ConfirmIcon size={24} />}\n src=\"\"\n />\n }\n >\n <Avatar\n ariaLabel=\"\"\n gradient=\"hades-dark\"\n icon={<ConfirmIcon size={24} />}\n src=\"\"\n />\n </Show>\n </HStack>\n <DialogHeading>{content?.heading}</DialogHeading>\n <DialogDescription>{content?.description}</DialogDescription>\n </VStack>\n\n <HStack gap=\"4\" w=\"full\">\n <Button\n autoFocus\n className={css({\n w: '1/2',\n })}\n name=\"confirm\"\n onClick={handleChoice}\n palette={palette}\n value=\"true\"\n >\n {content?.actionText}\n </Button>\n <DialogCloseTrigger asChild>\n <Button\n className={css({\n w: '1/2',\n })}\n name=\"cancel\"\n onClick={handleChoice}\n usage=\"outlined\"\n value=\"false\"\n >\n {content?.cancelText}\n </Button>\n </DialogCloseTrigger>\n </HStack>\n </VStack>\n </Dialog>\n </DialogProvider>\n </ConfirmModalContext.Provider>\n )\n}\n\nexport function useConfirmModal(): ConfirmModalValue {\n const context = useContext(ConfirmModalContext)\n if (context === null) {\n throw new Error(\n 'useConfirmModal must be used within a ConfirmModal Provider',\n )\n }\n return context\n}\n","'use client'\n\nimport {\n type ButtonHTMLAttributes,\n type PropsWithChildren,\n createContext,\n useContext,\n useMemo,\n} from 'react'\nimport { cx } from '@cerberus/styled-system/css'\nimport {\n button,\n type ButtonVariantProps,\n} from '@cerberus/styled-system/recipes'\nimport { Show } from '../Show'\nimport { Spinner } from '../Spinner'\nimport { Box } from '@cerberus/styled-system/jsx'\n\n/**\n * This module contains the Button component.\n * @module\n */\n\ninterface ButtonContextValue {\n pending: boolean\n}\n\nconst ButtonContext = createContext<ButtonContextValue>({\n pending: false,\n})\n\nexport type ButtonProps = ButtonHTMLAttributes<HTMLButtonElement> &\n ButtonVariantProps & {\n pending?: boolean\n }\n\n/**\n * A component that allows the user to perform actions\n * @see https://cerberus.digitalu.design/react/button\n */\nexport function Button(props: ButtonProps): JSX.Element {\n const { palette, usage, shape, size, pending = false, ...nativeProps } = props\n const value = useMemo(() => ({ pending }), [pending])\n\n return (\n <ButtonContext.Provider value={value}>\n <button\n {...nativeProps}\n disabled={pending || nativeProps.disabled}\n className={cx(\n nativeProps.className,\n button({\n palette,\n usage,\n shape,\n size,\n }),\n )}\n />\n </ButtonContext.Provider>\n )\n}\n\n/**\n * An icon to display in a button that utilizes the pending state to display\n * a loading spinner.\n */\nexport function ButtonIcon(props: PropsWithChildren<object>) {\n const { pending } = useContext(ButtonContext)\n return (\n <Show when={pending} fallback={<>{props.children}</>}>\n <Box w=\"4\">\n <Spinner />\n </Box>\n </Show>\n )\n}\n","'use client'\n\nimport { useMemo, type PropsWithChildren, type ReactNode } from 'react'\n\n/**\n * This module contains the Show component.\n * @module\n */\n\nexport interface ShowProps {\n /**\n * The condition to render memoized children or the fallback content.\n */\n when: boolean | null | undefined\n /**\n * The children to render when the condition is false.\n */\n fallback?: ReactNode\n}\n\n/**\n * Conditionally render a memoized version of the children or optional fallback\n * content.\n * @see https://cerberus.digitalu.design/react/show\n * @example\n * ```tsx\n * <Show when={isLoggedIn} fallback={<Navigate to=\"/login\" />}>\n * <Dashboard />\n * </Show>\n */\nexport function Show(props: PropsWithChildren<ShowProps>): ReactNode {\n const { when, children, fallback } = props\n const condition = useMemo(() => when ?? false, [when])\n\n return useMemo(() => {\n if (condition) return children\n return fallback ?? null\n }, [condition, children, fallback])\n}\n","'use client'\n\nimport { css, cx } from '@cerberus/styled-system/css'\nimport { circle } from '@cerberus/styled-system/patterns'\nimport {\n avatar,\n type AvatarVariantProps,\n} from '@cerberus/styled-system/recipes'\nimport type { HtmlHTMLAttributes, ReactNode } from 'react'\nimport { Show } from './Show'\nimport { useCerberusContext } from '../context/cerberus'\n\n/**\n * This module contains the Avatar component.\n * @module\n */\n\nexport type SharedAvatarProps = {\n /**\n * An optional icon to show when no src or ariaLabel is provided.\n */\n icon?: ReactNode\n /**\n * The size of the avatar.\n */\n width?: number\n /**\n * The size of the avatar.\n */\n height?: number\n}\nexport type AvatarImageProps = HtmlHTMLAttributes<HTMLImageElement> &\n SharedAvatarProps & {\n /**\n * The aria-label for the avatar needed for accessibility.\n */\n ariaLabel: string\n /**\n * An optional element to replace the image. Recommended for Next.js Image component.\n */\n as?: never\n /**\n * The source of the image.\n */\n src: string\n }\nexport type AvatarAsProps = SharedAvatarProps & {\n /**\n * An optional element to replace the image. Recommended for Next.js Image component.\n */\n as: ReactNode\n /**\n * The aria-label for the avatar needed for accessibility.\n */\n ariaLabel?: never\n /**\n * The source of the image.\n */\n src?: never\n}\n\nexport type AvatarProps = (HtmlHTMLAttributes<HTMLDivElement> &\n AvatarVariantProps) &\n (AvatarImageProps | AvatarAsProps)\n\n/**\n * The Avatar component is used to represent a user or entity. It will show an image if src provided, otherwise it will show the ariaLabel of the ariaLabel. If the ariaLabel is empty, it will show a `defineIcons().avatar` icon.\n * @see https://cerberus.digitalu.design/react/avatar\n * @example\n * ```tsx\n * <Avatar\n * ariaLabel=\"Protector Cerberus\"\n * src=\"https://cerberus.digitalu.design/logo.svg\"\n * />\n * ```\n */\nexport function Avatar(props: AvatarProps) {\n const {\n ariaLabel,\n as,\n gradient,\n size,\n src,\n width,\n height,\n icon,\n ...nativeProps\n } = props\n const { icons } = useCerberusContext()\n const { avatar: AvatarIcon } = icons\n const initials = (ariaLabel || '')\n .split(' ')\n .map((word) => word[0])\n .join('')\n .slice(0, 2)\n\n return (\n <div\n {...nativeProps}\n className={cx(\n nativeProps.className,\n avatar({ gradient, size }),\n circle(),\n )}\n >\n <Show\n when={Boolean(src) || Boolean(as)}\n fallback={\n <Show\n when={Boolean(initials)}\n fallback={\n <Show\n when={Boolean(icon)}\n fallback={\n <AvatarIcon\n size={iconSizeMap[size as keyof typeof iconSizeMap]}\n />\n }\n >\n {icon}\n </Show>\n }\n >\n {initials}\n </Show>\n }\n >\n <Show\n when={Boolean(as)}\n fallback={\n <img\n alt={props.ariaLabel}\n className={css({\n h: 'full',\n objectFit: 'cover',\n w: 'full',\n })}\n decoding=\"async\"\n loading=\"lazy\"\n src={src}\n height={height}\n width={width}\n />\n }\n >\n {as}\n </Show>\n </Show>\n </div>\n )\n}\n\nconst iconSizeMap = {\n xs: 16,\n sm: 16,\n md: 20,\n lg: 34,\n xl: 32,\n '2xl': 32,\n '3xl': 32,\n '4xl': 32,\n}\n","'use client'\n\nimport { createContext, useContext, type PropsWithChildren } from 'react'\nimport type { SystemConfig } from '../config'\n\n/**\n * This module contains the Cerberus configuration context and helpers.\n * @module context/cerberus\n */\n\ntype CerberusContextValue = SystemConfig\n\nconst CerberusContext = createContext<CerberusContextValue | null>(null)\n\ninterface CerberusProviderProps {\n config: SystemConfig\n}\n\n/**\n * Cerberus configuration provider.\n * @param props.config The Cerberus configuration created with\n * `makeSystemConfig` helper.\n */\nexport function CerberusProvider(\n props: PropsWithChildren<CerberusProviderProps>,\n) {\n return (\n <CerberusContext.Provider value={props.config}>\n {props.children}\n </CerberusContext.Provider>\n )\n}\n\n/**\n * Returns the Cerberus configuration context.\n * @returns The Cerberus configuration context.\n */\nexport function useCerberusContext() {\n const context = useContext(CerberusContext)\n if (!context) {\n throw new Error('useCerberus must be used within a CerberusProvider')\n }\n return context\n}\n","import {\n Dialog as ArkDialog,\n type DialogContentProps as ArkDialogContentProps,\n type DialogRootProps,\n type DialogTitleProps,\n} from '@ark-ui/react'\nimport {\n dialog,\n type DialogVariantProps,\n} from '@cerberus/styled-system/recipes'\nimport { Portal } from './Portal'\nimport { cx } from '@cerberus/styled-system/css'\n\nexport type DialogProviderProps = DialogRootProps\n\n/**\n * The provider that controls the dialog components.\n * @definition [Dialog docs](https://cerberus.digitalu.design/react/dialog)\n * @example\n * ```tsx\n * <DialogProvider>\n * <DialogTrigger asChild>\n * <Button>Open Dialog</Button>\n * </DialogTrigger>\n * <Dialog>\n * <Text>Dialog Content</Text>\n * <DialogCloseTrigger>Close</DialogCloseTrigger>\n * </Dialog>\n * </DialogProvider>\n * ```\n */\nexport function DialogProvider(props: DialogProviderProps) {\n return <ArkDialog.Root {...props} />\n}\n\nexport interface DialogProps\n extends Omit<ArkDialogContentProps, 'size'>,\n DialogVariantProps {}\n\n/**\n * The content of the dialog. Must be used within the `DialogProvider` component.\n * @definition [Dialog docs](https://cerberus.digitalu.design/react/dialog)\n * @example\n * ```tsx\n * <DialogProvider>\n * <DialogTrigger asChild>\n * <Button>Open Dialog</Button>\n * </DialogTrigger>\n * <Dialog>\n * <Text>Dialog Content</Text>\n * </Dialog>\n * </DialogProvider>\n * ```\n */\nexport function Dialog(props: DialogProps) {\n const { size, ...contentProps } = props\n const styles = dialog({ size })\n return (\n <Portal>\n <DialogBackdrop className={styles.backdrop} />\n <DialogPositioner className={styles.positioner}>\n <DialogContent className={styles.content} {...contentProps} />\n </DialogPositioner>\n </Portal>\n )\n}\n\n/**\n * The heading of the dialog. Must be used within the `DialogContent` component.\n * @definition [Dialog docs](https://cerberus.digitalu.design/react/dialog)\n * @example\n * ```tsx\n * <DialogProvider>\n * <DialogTrigger asChild>\n * <Button>Open Dialog</Button>\n * </DialogTrigger>\n * <Dialog>\n * <DialogHeading>Dialog Title</DialogHeading>\n * <Text>Dialog Content</Text>\n * </Dialog>\n * </DialogProvider>\n * ```\n */\nexport function DialogHeading(props: DialogTitleProps) {\n const styles = dialog()\n return (\n <ArkDialog.Title {...props} className={cx(props.className, styles.title)} />\n )\n}\n\n/**\n * The description of the dialog. Must be used within the `DialogContent` component.\n * @definition [Dialog docs](https://cerberus.digitalu.design/react/dialog)\n * @example\n * ```tsx\n * <DialogProvider>\n * <DialogTrigger asChild>\n * <Button>Open Dialog</Button>\n * </DialogTrigger>\n * <Dialog>\n * <DialogHeading>Dialog Title</DialogHeading>\n * <DialogDescription>Dialog Description</DialogDescription>\n * </Dialog>\n * </DialogProvider>\n * ```\n */\nexport function DialogDescription(props: DialogTitleProps) {\n const styles = dialog()\n return (\n <ArkDialog.Description\n {...props}\n className={cx(props.className, styles.description)}\n />\n )\n}\n\n/**\n * The trigger that opens the dialog. Must be used within the `DialogProvider`\n * component.\n * @definition [Dialog docs](https://cerberus.digitalu.design/react/dialog)\n * @example\n * ```tsx\n * <DialogTrigger asChild>\n * <Button>Open Dialog</Button>\n * </DialogTrigger>\n * ```\n */\nexport const DialogTrigger = ArkDialog.Trigger\n\n/**\n * The trigger that closes the dialog. Must be used within the `DialogProvider`\n * component.\n * @definition [Dialog docs](https://cerberus.digitalu.design/react/dialog)\n * @example\n * ```tsx\n * <DialogProvider>\n * <DialogTrigger asChild>\n * <Button>Open Dialog</Button>\n * </DialogTrigger>\n * <Dialog>\n * <Text>Dialog Content</Text>\n * <DialogCloseTrigger>Close</DialogCloseTrigger>\n * </Dialog>\n * </DialogProvider>\n * ```\n */\nexport const DialogCloseTrigger = ArkDialog.CloseTrigger\n\n/**\n * The backdrop of the dialog. Must be used within the `DialogProvider`\n * component.\n */\nexport const DialogBackdrop = ArkDialog.Backdrop\n\n/**\n * The positioner of the dialog. Must be used within the `DialogProvider`\n * component.\n */\nexport const DialogPositioner = ArkDialog.Positioner\n\n/**\n * The content of the dialog. Must be used within the `DialogProvider`\n * component.\n */\nexport const DialogContent = ArkDialog.Content\n","import {\n Portal as ArkPortal,\n type PortalProps as ArkPortalProps,\n} from '@ark-ui/react'\n\n/**\n * This module is the Portal component.\n * @module\n */\n\nexport type PortalProps = ArkPortalProps\n\n/**\n * The Portal component is used to render children into a DOM node that exists outside the DOM hierarchy of the parent component.\n * @see https://cerberus.digitalu.design/react/portal\n * @definition [React Portal Docs](https://react.dev/reference/react-dom/createPortal)\n * @example\n * ```tsx\n * 'use client'\n *\n * import { Portal } from '@cerberus/react'\n *\n * function SomeFeatureWithinSSRPage() {\n * return (\n * <Portal>\n * <div>Portal Content outside of the React VDom tree</div>\n * </Portal>\n * )\n * }\n */\nexport const Portal = ArkPortal\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,IAAAA,gBAUO;;;ACVP,IAAAC,gBAMO;AACP,iBAAmB;AACnB,qBAGO;;;ACXP,mBAAgE;AA4BzD,SAAS,KAAK,OAAgD;AACnE,QAAM,EAAE,MAAM,UAAU,SAAS,IAAI;AACrC,QAAM,gBAAY,sBAAQ,MAAM,QAAQ,OAAO,CAAC,IAAI,CAAC;AAErD,aAAO,sBAAQ,MAAM;AACnB,QAAI,UAAW,QAAO;AACtB,WAAO,YAAY;AAAA,EACrB,GAAG,CAAC,WAAW,UAAU,QAAQ,CAAC;AACpC;;;ADtBA,iBAAoB;AA8Bd;AAnBN,IAAM,oBAAgB,6BAAkC;AAAA,EACtD,SAAS;AACX,CAAC;AAWM,SAAS,OAAO,OAAiC;AACtD,QAAM,EAAE,SAAS,OAAO,OAAO,MAAM,UAAU,OAAO,GAAG,YAAY,IAAI;AACzE,QAAM,YAAQ,uBAAQ,OAAO,EAAE,QAAQ,IAAI,CAAC,OAAO,CAAC;AAEpD,SACE,4CAAC,cAAc,UAAd,EAAuB,OACtB;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ,UAAU,WAAW,YAAY;AAAA,MACjC,eAAW;AAAA,QACT,YAAY;AAAA,YACZ,uBAAO;AAAA,UACL;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,QACF,CAAC;AAAA,MACH;AAAA;AAAA,EACF,GACF;AAEJ;;;AD/CA,IAAAC,cAAoB;;;AGZpB,IAAAC,cAAwB;AACxB,sBAAuB;AACvB,IAAAC,kBAGO;;;ACLP,IAAAC,gBAAkE;AAyB9D,IAAAC,sBAAA;AAfJ,IAAM,sBAAkB,6BAA2C,IAAI;AAyBhE,SAAS,qBAAqB;AACnC,QAAM,cAAU,0BAAW,eAAe;AAC1C,MAAI,CAAC,SAAS;AACZ,UAAM,IAAI,MAAM,oDAAoD;AAAA,EACtE;AACA,SAAO;AACT;;;ADuEkB,IAAAC,sBAAA;AAtCX,SAAS,OAAO,OAAoB;AACzC,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,IAAI;AACJ,QAAM,EAAE,MAAM,IAAI,mBAAmB;AACrC,QAAM,EAAE,QAAQ,WAAW,IAAI;AAC/B,QAAM,YAAY,aAAa,IAC5B,MAAM,GAAG,EACT,IAAI,CAAC,SAAS,KAAK,CAAC,CAAC,EACrB,KAAK,EAAE,EACP,MAAM,GAAG,CAAC;AAEb,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ,eAAW;AAAA,QACT,YAAY;AAAA,YACZ,wBAAO,EAAE,UAAU,KAAK,CAAC;AAAA,YACzB,wBAAO;AAAA,MACT;AAAA,MAEA;AAAA,QAAC;AAAA;AAAA,UACC,MAAM,QAAQ,GAAG,KAAK,QAAQ,EAAE;AAAA,UAChC,UACE;AAAA,YAAC;AAAA;AAAA,cACC,MAAM,QAAQ,QAAQ;AAAA,cACtB,UACE;AAAA,gBAAC;AAAA;AAAA,kBACC,MAAM,QAAQ,IAAI;AAAA,kBAClB,UACE;AAAA,oBAAC;AAAA;AAAA,sBACC,MAAM,YAAY,IAAgC;AAAA;AAAA,kBACpD;AAAA,kBAGD;AAAA;AAAA,cACH;AAAA,cAGD;AAAA;AAAA,UACH;AAAA,UAGF;AAAA,YAAC;AAAA;AAAA,cACC,MAAM,QAAQ,EAAE;AAAA,cAChB,UACE;AAAA,gBAAC;AAAA;AAAA,kBACC,KAAK,MAAM;AAAA,kBACX,eAAW,iBAAI;AAAA,oBACb,GAAG;AAAA,oBACH,WAAW;AAAA,oBACX,GAAG;AAAA,kBACL,CAAC;AAAA,kBACD,UAAS;AAAA,kBACT,SAAQ;AAAA,kBACR;AAAA,kBACA;AAAA,kBACA;AAAA;AAAA,cACF;AAAA,cAGD;AAAA;AAAA,UACH;AAAA;AAAA,MACF;AAAA;AAAA,EACF;AAEJ;AAEA,IAAM,cAAc;AAAA,EAClB,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,OAAO;AAAA,EACP,OAAO;AAAA,EACP,OAAO;AACT;;;AHhJA,IAAAC,cAA+B;;;AKjB/B,IAAAC,gBAKO;AACP,IAAAC,kBAGO;;;ACTP,IAAAC,gBAGO;AA2BA,IAAM,SAAS,cAAAC;;;ADnBtB,IAAAC,cAAmB;AAqBV,IAAAC,sBAAA;AADF,SAAS,eAAe,OAA4B;AACzD,SAAO,6CAAC,cAAAC,OAAU,MAAV,EAAgB,GAAG,OAAO;AACpC;AAqBO,SAAS,OAAO,OAAoB;AACzC,QAAM,EAAE,MAAM,GAAG,aAAa,IAAI;AAClC,QAAM,aAAS,wBAAO,EAAE,KAAK,CAAC;AAC9B,SACE,8CAAC,UACC;AAAA,iDAAC,kBAAe,WAAW,OAAO,UAAU;AAAA,IAC5C,6CAAC,oBAAiB,WAAW,OAAO,YAClC,uDAAC,iBAAc,WAAW,OAAO,SAAU,GAAG,cAAc,GAC9D;AAAA,KACF;AAEJ;AAkBO,SAAS,cAAc,OAAyB;AACrD,QAAM,aAAS,wBAAO;AACtB,SACE,6CAAC,cAAAA,OAAU,OAAV,EAAiB,GAAG,OAAO,eAAW,gBAAG,MAAM,WAAW,OAAO,KAAK,GAAG;AAE9E;AAkBO,SAAS,kBAAkB,OAAyB;AACzD,QAAM,aAAS,wBAAO;AACtB,SACE;AAAA,IAAC,cAAAA,OAAU;AAAA,IAAV;AAAA,MACE,GAAG;AAAA,MACJ,eAAW,gBAAG,MAAM,WAAW,OAAO,WAAW;AAAA;AAAA,EACnD;AAEJ;AAaO,IAAM,gBAAgB,cAAAA,OAAU;AAmBhC,IAAM,qBAAqB,cAAAA,OAAU;AAMrC,IAAM,iBAAiB,cAAAA,OAAU;AAMjC,IAAM,mBAAmB,cAAAA,OAAU;AAMnC,IAAM,gBAAgB,cAAAA,OAAU;;;ALG3B,IAAAC,sBAAA;AAlFZ,IAAM,0BAAsB,6BAAwC,IAAI;AA6BjE,SAAS,aACd,OACA;AACA,QAAM,CAAC,MAAM,OAAO,QAAI,wBAAkB,KAAK;AAC/C,QAAM,CAAC,SAAS,UAAU,QAAI,wBAAyC,IAAI;AAC3E,QAAM,iBAAa,sBAAmB,IAAI;AAC1C,QAAM,QAAO,mCAAS,SAAQ;AAE9B,QAAM,EAAE,MAAM,IAAI,mBAAmB;AACrC,QAAM,EAAE,cAAc,YAAY,IAAI;AAEtC,QAAM,cAAU;AAAA,IACd,MAAO,SAAS,gBAAgB,WAAW;AAAA,IAC3C,CAAC,IAAI;AAAA,EACP;AAEA,QAAM,mBAAe;AAAA,IACnB,CAAC,MAAqC;AAnI1C;AAoIM,YAAM,SAAS,EAAE;AACjB,UAAI,OAAO,UAAU,QAAQ;AAC3B,yBAAW,YAAX,oCAAqB;AAAA,MACvB;AACA,uBAAW,YAAX,oCAAqB;AACrB,cAAQ,KAAK;AAAA,IACf;AAAA,IACA,CAAC,OAAO;AAAA,EACV;AAEA,QAAM,iBAAa;AAAA,IACjB,CAAC,YAAqC;AACpC,aAAO,IAAI,QAAiB,CAAC,YAAY;AACvC,mBAAW,EAAE,GAAG,QAAQ,CAAC;AACzB,gBAAQ,IAAI;AACZ,mBAAW,UAAU;AAAA,MACvB,CAAC;AAAA,IACH;AAAA,IACA,CAAC,SAAS,UAAU;AAAA,EACtB;AAEA,QAAM,YAAQ;AAAA,IACZ,OAAO;AAAA,MACL,MAAM;AAAA,IACR;AAAA,IACA,CAAC,UAAU;AAAA,EACb;AAEA,SACE,8CAAC,oBAAoB,UAApB,EAA6B,OAC3B;AAAA,UAAM;AAAA,IAEP,6CAAC,kBAAe,MAAY,cAAc,CAAC,MAAM,QAAQ,EAAE,IAAI,GAC7D,uDAAC,UAAO,MAAK,MACX,wDAAC,sBAAO,KAAI,MAAK,GAAE,QACjB;AAAA,oDAAC,sBAAO,YAAW,cAAa,KAAI,MAAK,GAAE,QACzC;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,WAAU;AAAA,YACV,SAAQ;AAAA,YACR,iBAAgB;AAAA,YAChB,GAAE;AAAA,YAEF;AAAA,cAAC;AAAA;AAAA,gBACC,MAAM,YAAY;AAAA,gBAClB,UACE;AAAA,kBAAC;AAAA;AAAA,oBACC,WAAU;AAAA,oBACV,UAAS;AAAA,oBACT,MAAM,6CAAC,eAAY,MAAM,IAAI;AAAA,oBAC7B,KAAI;AAAA;AAAA,gBACN;AAAA,gBAGF;AAAA,kBAAC;AAAA;AAAA,oBACC,WAAU;AAAA,oBACV,UAAS;AAAA,oBACT,MAAM,6CAAC,eAAY,MAAM,IAAI;AAAA,oBAC7B,KAAI;AAAA;AAAA,gBACN;AAAA;AAAA,YACF;AAAA;AAAA,QACF;AAAA,QACA,6CAAC,iBAAe,6CAAS,SAAQ;AAAA,QACjC,6CAAC,qBAAmB,6CAAS,aAAY;AAAA,SAC3C;AAAA,MAEA,8CAAC,sBAAO,KAAI,KAAI,GAAE,QAChB;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,WAAS;AAAA,YACT,eAAW,iBAAI;AAAA,cACb,GAAG;AAAA,YACL,CAAC;AAAA,YACD,MAAK;AAAA,YACL,SAAS;AAAA,YACT;AAAA,YACA,OAAM;AAAA,YAEL,6CAAS;AAAA;AAAA,QACZ;AAAA,QACA,6CAAC,sBAAmB,SAAO,MACzB;AAAA,UAAC;AAAA;AAAA,YACC,eAAW,iBAAI;AAAA,cACb,GAAG;AAAA,YACL,CAAC;AAAA,YACD,MAAK;AAAA,YACL,SAAS;AAAA,YACT,OAAM;AAAA,YACN,OAAM;AAAA,YAEL,6CAAS;AAAA;AAAA,QACZ,GACF;AAAA,SACF;AAAA,OACF,GACF,GACF;AAAA,KACF;AAEJ;AAEO,SAAS,kBAAqC;AACnD,QAAM,cAAU,0BAAW,mBAAmB;AAC9C,MAAI,YAAY,MAAM;AACpB,UAAM,IAAI;AAAA,MACR;AAAA,IACF;AAAA,EACF;AACA,SAAO;AACT;","names":["import_react","import_react","import_css","import_css","import_recipes","import_react","import_jsx_runtime","import_jsx_runtime","import_jsx","import_react","import_recipes","import_react","ArkPortal","import_css","import_jsx_runtime","ArkDialog","import_jsx_runtime"]}
|
|
1
|
+
{"version":3,"sources":["../../../src/context/confirm-modal.tsx","../../../src/components/button/button.tsx","../../../src/components/Show.tsx","../../../src/components/Avatar.tsx","../../../src/context/cerberus.tsx","../../../src/components/Dialog.tsx","../../../src/components/Portal.tsx"],"sourcesContent":["'use client'\n\nimport {\n createContext,\n useCallback,\n useContext,\n useMemo,\n useRef,\n useState,\n type MouseEvent,\n type PropsWithChildren,\n type ReactNode,\n} from 'react'\nimport { Button } from '../components/button/button'\nimport { css } from '@cerberus/styled-system/css'\nimport { Show } from '../components/Show'\nimport { Avatar } from '../components/Avatar'\nimport { HStack, VStack } from '@cerberus/styled-system/jsx'\nimport { useCerberusContext } from './cerberus'\nimport {\n Dialog,\n DialogCloseTrigger,\n DialogDescription,\n DialogHeading,\n DialogProvider,\n} from '../components/Dialog'\n\n/**\n * This module provides a context and hook for the confirm modal.\n * @module\n */\n\nexport interface BaseConfirmOptions {\n /**\n * The heading of the confirm modal.\n */\n heading: string\n /**\n * The text for the action button.\n */\n actionText: string\n /**\n * The text for the cancel button.\n */\n cancelText: string\n}\n\nexport interface DestructiveConfirmOptions extends BaseConfirmOptions {\n /**\n * The kind of confirm modal to show.\n */\n kind?: 'destructive'\n /**\n * The description of the confirm modal. Can only be a string for destructive confirm modals.\n */\n description?: string\n}\n\nexport interface NonDestructiveConfirmModalOptions extends BaseConfirmOptions {\n /**\n * The kind of confirm modal to show.\n * @default 'non-destructive'\n */\n kind?: 'non-destructive'\n /**\n * The description of the confirm modal. Can be a ReactNode for non-destructive kind if you need to display text links.\n * @example\n * ```tsx\n * description: <>Use a Fragment because we put the content within a Paragraph tag.</>\n */\n description?: ReactNode\n}\n\nexport type ShowConfirmModalOptions =\n | NonDestructiveConfirmModalOptions\n | DestructiveConfirmOptions\n\nexport type ShowResult =\n | ((value: boolean | PromiseLike<boolean>) => void)\n | null\n\nexport interface ConfirmModalValue {\n show: (options: ShowConfirmModalOptions) => Promise<boolean>\n}\n\nconst ConfirmModalContext = createContext<ConfirmModalValue | null>(null)\n\nexport type ConfirmModalProviderProps = PropsWithChildren<unknown>\n\n/**\n * Provides a confirm modal to the app.\n * @see https://cerberus.digitalu.design/react/confirm-modal\n * @example\n * ```tsx\n * // Wrap the Provider around the root of the feature.\n * <ConfirmModal>\n * <SomeFeatureSection />\n * </ConfirmModal>\n *\n * // Use the hook to show the confirm modal.\n * const confirm = useConfirmModal()\n *\n * const handleClick = useCallback(async () => {\n * const userConsent = await confirm.show({\n * heading: 'Add new payment method?',\n * description:\n * 'This will add a new payment method to your account to be billed for future purchases.',\n * actionText: 'Yes, add payment method',\n * cancelText: 'No, cancel',\n * })\n * setConsent(userConsent)\n * }, [confirm])\n * ```\n */\nexport function ConfirmModal(\n props: PropsWithChildren<ConfirmModalProviderProps>,\n) {\n const [open, setOpen] = useState<boolean>(false)\n const [content, setContent] = useState<ShowConfirmModalOptions | null>(null)\n const resolveRef = useRef<ShowResult>(null)\n const kind = content?.kind ?? 'non-destructive'\n\n const { icons } = useCerberusContext()\n const { confirmModal: ConfirmIcon } = icons\n\n const palette = useMemo(\n () => (kind === 'destructive' ? 'danger' : 'action'),\n [kind],\n )\n\n const handleChoice = useCallback(\n (e: MouseEvent<HTMLButtonElement>) => {\n const target = e.currentTarget as HTMLButtonElement\n if (target.value === 'true') {\n resolveRef.current?.(true)\n }\n resolveRef.current?.(false)\n setOpen(false)\n },\n [setOpen],\n )\n\n const handleShow = useCallback(\n (options: ShowConfirmModalOptions) => {\n return new Promise<boolean>((resolve) => {\n setContent({ ...options })\n setOpen(true)\n resolveRef.current = resolve\n })\n },\n [setOpen, setContent],\n )\n\n const value = useMemo(\n () => ({\n show: handleShow,\n }),\n [handleShow],\n )\n\n return (\n <ConfirmModalContext.Provider value={value}>\n {props.children}\n\n <DialogProvider open={open} onOpenChange={(e) => setOpen(e.open)}>\n <Dialog size=\"sm\">\n <VStack gap=\"xl\" w=\"full\">\n <VStack alignItems=\"flex-start\" gap=\"md\" w=\"full\">\n <HStack\n alignSelf=\"center\"\n justify=\"center\"\n paddingBlockEnd=\"md\"\n w=\"full\"\n >\n <Show\n when={palette === 'danger'}\n fallback={\n <Avatar\n ariaLabel=\"\"\n gradient=\"charon-light\"\n icon={<ConfirmIcon size={24} />}\n src=\"\"\n />\n }\n >\n <Avatar\n ariaLabel=\"\"\n gradient=\"hades-dark\"\n icon={<ConfirmIcon size={24} />}\n src=\"\"\n />\n </Show>\n </HStack>\n <DialogHeading>{content?.heading}</DialogHeading>\n <DialogDescription>{content?.description}</DialogDescription>\n </VStack>\n\n <HStack gap=\"4\" w=\"full\">\n <Button\n autoFocus\n className={css({\n w: '1/2',\n })}\n name=\"confirm\"\n onClick={handleChoice}\n palette={palette}\n value=\"true\"\n >\n {content?.actionText}\n </Button>\n <DialogCloseTrigger asChild>\n <Button\n className={css({\n w: '1/2',\n })}\n name=\"cancel\"\n onClick={handleChoice}\n usage=\"outlined\"\n value=\"false\"\n >\n {content?.cancelText}\n </Button>\n </DialogCloseTrigger>\n </HStack>\n </VStack>\n </Dialog>\n </DialogProvider>\n </ConfirmModalContext.Provider>\n )\n}\n\nexport function useConfirmModal(): ConfirmModalValue {\n const context = useContext(ConfirmModalContext)\n if (context === null) {\n throw new Error(\n 'useConfirmModal must be used within a ConfirmModal Provider',\n )\n }\n return context\n}\n","'use client'\n\nimport {\n type ButtonHTMLAttributes,\n type PropsWithChildren,\n createContext,\n useContext,\n useMemo,\n} from 'react'\nimport { cx } from '@cerberus/styled-system/css'\nimport {\n button,\n type ButtonVariantProps,\n} from '@cerberus/styled-system/recipes'\nimport { Box } from '@cerberus/styled-system/jsx'\nimport { Show } from '../Show'\nimport { Spinner } from '../Spinner'\n\n/**\n * This module contains the Button component.\n * @module\n */\n\ninterface ButtonContextValue {\n pending: boolean\n}\n\nconst ButtonContext = createContext<ButtonContextValue>({\n pending: false,\n})\n\nexport type ButtonProps = ButtonHTMLAttributes<HTMLButtonElement> &\n ButtonVariantProps & {\n pending?: boolean\n }\n\n/**\n * A component that allows the user to perform actions\n * @see https://cerberus.digitalu.design/react/button\n */\nexport function Button(props: ButtonProps): JSX.Element {\n const { palette, usage, shape, size, pending = false, ...nativeProps } = props\n const value = useMemo(() => ({ pending }), [pending])\n\n return (\n <ButtonContext.Provider value={value}>\n <button\n {...nativeProps}\n disabled={pending || nativeProps.disabled}\n className={cx(\n nativeProps.className,\n button({\n palette,\n usage,\n shape,\n size,\n }),\n )}\n />\n </ButtonContext.Provider>\n )\n}\n\n/**\n * An icon to display in a button that utilizes the pending state to display\n * a loading spinner.\n */\nexport function ButtonIcon(props: PropsWithChildren<object>) {\n const { pending } = useContext(ButtonContext)\n return (\n <Show when={pending} fallback={<>{props.children}</>}>\n <Box w=\"4\">\n <Spinner />\n </Box>\n </Show>\n )\n}\n","'use client'\n\nimport { useMemo, type PropsWithChildren, type ReactNode } from 'react'\n\n/**\n * This module contains the Show component.\n * @module\n */\n\nexport interface ShowProps {\n /**\n * The condition to render memoized children or the fallback content.\n */\n when: boolean | null | undefined\n /**\n * The children to render when the condition is false.\n */\n fallback?: ReactNode\n}\n\n/**\n * Conditionally render a memoized version of the children or optional fallback\n * content.\n * @see https://cerberus.digitalu.design/react/show\n * @example\n * ```tsx\n * <Show when={isLoggedIn} fallback={<Navigate to=\"/login\" />}>\n * <Dashboard />\n * </Show>\n */\nexport function Show(props: PropsWithChildren<ShowProps>): ReactNode {\n const { when, children, fallback } = props\n const condition = useMemo(() => when ?? false, [when])\n\n return useMemo(() => {\n if (condition) return children\n return fallback ?? null\n }, [condition, children, fallback])\n}\n","'use client'\n\nimport { css, cx } from '@cerberus/styled-system/css'\nimport { circle } from '@cerberus/styled-system/patterns'\nimport {\n avatar,\n type AvatarVariantProps,\n} from '@cerberus/styled-system/recipes'\nimport type { HtmlHTMLAttributes, ReactNode } from 'react'\nimport { Show } from './Show'\nimport { useCerberusContext } from '../context/cerberus'\n\n/**\n * This module contains the Avatar component.\n * @module\n */\n\nexport type SharedAvatarProps = {\n /**\n * An optional icon to show when no src or ariaLabel is provided.\n */\n icon?: ReactNode\n /**\n * The size of the avatar.\n */\n width?: number\n /**\n * The size of the avatar.\n */\n height?: number\n}\nexport type AvatarImageProps = HtmlHTMLAttributes<HTMLImageElement> &\n SharedAvatarProps & {\n /**\n * The aria-label for the avatar needed for accessibility.\n */\n ariaLabel: string\n /**\n * An optional element to replace the image. Recommended for Next.js Image component.\n */\n as?: never\n /**\n * The source of the image.\n */\n src: string\n }\nexport type AvatarAsProps = SharedAvatarProps & {\n /**\n * An optional element to replace the image. Recommended for Next.js Image component.\n */\n as: ReactNode\n /**\n * The aria-label for the avatar needed for accessibility.\n */\n ariaLabel?: never\n /**\n * The source of the image.\n */\n src?: never\n}\n\nexport type AvatarProps = (HtmlHTMLAttributes<HTMLDivElement> &\n AvatarVariantProps) &\n (AvatarImageProps | AvatarAsProps)\n\n/**\n * The Avatar component is used to represent a user or entity. It will show an image if src provided, otherwise it will show the ariaLabel of the ariaLabel. If the ariaLabel is empty, it will show a `defineIcons().avatar` icon.\n * @see https://cerberus.digitalu.design/react/avatar\n * @example\n * ```tsx\n * <Avatar\n * ariaLabel=\"Protector Cerberus\"\n * src=\"https://cerberus.digitalu.design/logo.svg\"\n * />\n * ```\n */\nexport function Avatar(props: AvatarProps) {\n const {\n ariaLabel,\n as,\n gradient,\n size,\n src,\n width,\n height,\n icon,\n ...nativeProps\n } = props\n const { icons } = useCerberusContext()\n const { avatar: AvatarIcon } = icons\n const initials = (ariaLabel || '')\n .split(' ')\n .map((word) => word[0])\n .join('')\n .slice(0, 2)\n\n return (\n <div\n {...nativeProps}\n className={cx(\n nativeProps.className,\n avatar({ gradient, size }),\n circle(),\n )}\n >\n <Show\n when={Boolean(src) || Boolean(as)}\n fallback={\n <Show\n when={Boolean(initials)}\n fallback={\n <Show\n when={Boolean(icon)}\n fallback={\n <AvatarIcon\n size={iconSizeMap[size as keyof typeof iconSizeMap]}\n />\n }\n >\n {icon}\n </Show>\n }\n >\n {initials}\n </Show>\n }\n >\n <Show\n when={Boolean(as)}\n fallback={\n <img\n alt={props.ariaLabel}\n className={css({\n h: 'full',\n objectFit: 'cover',\n w: 'full',\n })}\n decoding=\"async\"\n loading=\"lazy\"\n src={src}\n height={height}\n width={width}\n />\n }\n >\n {as}\n </Show>\n </Show>\n </div>\n )\n}\n\nconst iconSizeMap = {\n xs: 16,\n sm: 16,\n md: 20,\n lg: 34,\n xl: 32,\n '2xl': 32,\n '3xl': 32,\n '4xl': 32,\n}\n","'use client'\n\nimport { createContext, useContext, type PropsWithChildren } from 'react'\nimport type { SystemConfig } from '../config'\n\n/**\n * This module contains the Cerberus configuration context and helpers.\n * @module context/cerberus\n */\n\ntype CerberusContextValue = SystemConfig\n\nconst CerberusContext = createContext<CerberusContextValue | null>(null)\n\ninterface CerberusProviderProps {\n config: SystemConfig\n}\n\n/**\n * Cerberus configuration provider.\n * @param props.config The Cerberus configuration created with\n * `makeSystemConfig` helper.\n */\nexport function CerberusProvider(\n props: PropsWithChildren<CerberusProviderProps>,\n) {\n return (\n <CerberusContext.Provider value={props.config}>\n {props.children}\n </CerberusContext.Provider>\n )\n}\n\n/**\n * Returns the Cerberus configuration context.\n * @returns The Cerberus configuration context.\n */\nexport function useCerberusContext() {\n const context = useContext(CerberusContext)\n if (!context) {\n throw new Error('useCerberus must be used within a CerberusProvider')\n }\n return context\n}\n","import {\n Dialog as ArkDialog,\n type DialogContentProps as ArkDialogContentProps,\n type DialogRootProps,\n type DialogTitleProps,\n} from '@ark-ui/react'\nimport {\n dialog,\n type DialogVariantProps,\n} from '@cerberus/styled-system/recipes'\nimport { Portal } from './Portal'\nimport { cx } from '@cerberus/styled-system/css'\n\nexport type DialogProviderProps = DialogRootProps\n\n/**\n * The provider that controls the dialog components.\n * @definition [Dialog docs](https://cerberus.digitalu.design/react/dialog)\n * @example\n * ```tsx\n * <DialogProvider>\n * <DialogTrigger asChild>\n * <Button>Open Dialog</Button>\n * </DialogTrigger>\n * <Dialog>\n * <Text>Dialog Content</Text>\n * <DialogCloseTrigger>Close</DialogCloseTrigger>\n * </Dialog>\n * </DialogProvider>\n * ```\n */\nexport function DialogProvider(props: DialogProviderProps) {\n return <ArkDialog.Root {...props} />\n}\n\nexport interface DialogProps\n extends Omit<ArkDialogContentProps, 'size'>,\n DialogVariantProps {}\n\n/**\n * The content of the dialog. Must be used within the `DialogProvider` component.\n * @definition [Dialog docs](https://cerberus.digitalu.design/react/dialog)\n * @example\n * ```tsx\n * <DialogProvider>\n * <DialogTrigger asChild>\n * <Button>Open Dialog</Button>\n * </DialogTrigger>\n * <Dialog>\n * <Text>Dialog Content</Text>\n * </Dialog>\n * </DialogProvider>\n * ```\n */\nexport function Dialog(props: DialogProps) {\n const { size, ...contentProps } = props\n const styles = dialog({ size })\n return (\n <Portal>\n <DialogBackdrop className={styles.backdrop} />\n <DialogPositioner className={styles.positioner}>\n <DialogContent className={styles.content} {...contentProps} />\n </DialogPositioner>\n </Portal>\n )\n}\n\n/**\n * The heading of the dialog. Must be used within the `DialogContent` component.\n * @definition [Dialog docs](https://cerberus.digitalu.design/react/dialog)\n * @example\n * ```tsx\n * <DialogProvider>\n * <DialogTrigger asChild>\n * <Button>Open Dialog</Button>\n * </DialogTrigger>\n * <Dialog>\n * <DialogHeading>Dialog Title</DialogHeading>\n * <Text>Dialog Content</Text>\n * </Dialog>\n * </DialogProvider>\n * ```\n */\nexport function DialogHeading(props: DialogTitleProps) {\n const styles = dialog()\n return (\n <ArkDialog.Title {...props} className={cx(props.className, styles.title)} />\n )\n}\n\n/**\n * The description of the dialog. Must be used within the `DialogContent` component.\n * @definition [Dialog docs](https://cerberus.digitalu.design/react/dialog)\n * @example\n * ```tsx\n * <DialogProvider>\n * <DialogTrigger asChild>\n * <Button>Open Dialog</Button>\n * </DialogTrigger>\n * <Dialog>\n * <DialogHeading>Dialog Title</DialogHeading>\n * <DialogDescription>Dialog Description</DialogDescription>\n * </Dialog>\n * </DialogProvider>\n * ```\n */\nexport function DialogDescription(props: DialogTitleProps) {\n const styles = dialog()\n return (\n <ArkDialog.Description\n {...props}\n className={cx(props.className, styles.description)}\n />\n )\n}\n\n/**\n * The trigger that opens the dialog. Must be used within the `DialogProvider`\n * component.\n * @definition [Dialog docs](https://cerberus.digitalu.design/react/dialog)\n * @example\n * ```tsx\n * <DialogTrigger asChild>\n * <Button>Open Dialog</Button>\n * </DialogTrigger>\n * ```\n */\nexport const DialogTrigger = ArkDialog.Trigger\n\n/**\n * The trigger that closes the dialog. Must be used within the `DialogProvider`\n * component.\n * @definition [Dialog docs](https://cerberus.digitalu.design/react/dialog)\n * @example\n * ```tsx\n * <DialogProvider>\n * <DialogTrigger asChild>\n * <Button>Open Dialog</Button>\n * </DialogTrigger>\n * <Dialog>\n * <Text>Dialog Content</Text>\n * <DialogCloseTrigger>Close</DialogCloseTrigger>\n * </Dialog>\n * </DialogProvider>\n * ```\n */\nexport const DialogCloseTrigger = ArkDialog.CloseTrigger\n\n/**\n * The backdrop of the dialog. Must be used within the `DialogProvider`\n * component.\n */\nexport const DialogBackdrop = ArkDialog.Backdrop\n\n/**\n * The positioner of the dialog. Must be used within the `DialogProvider`\n * component.\n */\nexport const DialogPositioner = ArkDialog.Positioner\n\n/**\n * The content of the dialog. Must be used within the `DialogProvider`\n * component.\n */\nexport const DialogContent = ArkDialog.Content\n","import {\n Portal as ArkPortal,\n type PortalProps as ArkPortalProps,\n} from '@ark-ui/react'\n\n/**\n * This module is the Portal component.\n * @module\n */\n\nexport type PortalProps = ArkPortalProps\n\n/**\n * The Portal component is used to render children into a DOM node that exists outside the DOM hierarchy of the parent component.\n * @see https://cerberus.digitalu.design/react/portal\n * @definition [React Portal Docs](https://react.dev/reference/react-dom/createPortal)\n * @example\n * ```tsx\n * 'use client'\n *\n * import { Portal } from '@cerberus/react'\n *\n * function SomeFeatureWithinSSRPage() {\n * return (\n * <Portal>\n * <div>Portal Content outside of the React VDom tree</div>\n * </Portal>\n * )\n * }\n */\nexport const Portal = ArkPortal\n"],"mappings":"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","names":["import_react","import_react","import_css","import_css","import_recipes","import_react","import_jsx_runtime","import_jsx_runtime","import_jsx","import_react","import_recipes","import_react","ArkPortal","import_css","import_jsx_runtime","ArkDialog","import_jsx_runtime"]}
|
|
@@ -31,6 +31,7 @@ var import_react7 = require("react");
|
|
|
31
31
|
var import_react2 = require("react");
|
|
32
32
|
var import_css = require("@cerberus/styled-system/css");
|
|
33
33
|
var import_recipes = require("@cerberus/styled-system/recipes");
|
|
34
|
+
var import_jsx = require("@cerberus/styled-system/jsx");
|
|
34
35
|
|
|
35
36
|
// src/components/Show.tsx
|
|
36
37
|
var import_react = require("react");
|
|
@@ -44,7 +45,6 @@ function Show(props) {
|
|
|
44
45
|
}
|
|
45
46
|
|
|
46
47
|
// src/components/button/button.tsx
|
|
47
|
-
var import_jsx = require("@cerberus/styled-system/jsx");
|
|
48
48
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
49
49
|
var ButtonContext = (0, import_react2.createContext)({
|
|
50
50
|
pending: false
|