@helpwave/hightide 0.1.27 → 0.1.28
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/coloring/index.d.mts +2 -0
- package/dist/coloring/index.d.ts +2 -0
- package/dist/coloring/index.js +85 -0
- package/dist/coloring/index.js.map +1 -0
- package/dist/coloring/index.mjs +48 -0
- package/dist/coloring/index.mjs.map +1 -0
- package/dist/components/branding/index.d.mts +3 -0
- package/dist/components/branding/index.d.ts +3 -0
- package/dist/components/branding/index.js +140 -0
- package/dist/components/branding/index.js.map +1 -0
- package/dist/components/branding/index.mjs +104 -0
- package/dist/components/branding/index.mjs.map +1 -0
- package/dist/components/date/index.d.mts +10 -0
- package/dist/components/date/index.d.ts +10 -0
- package/dist/components/date/index.js +1168 -0
- package/dist/components/date/index.js.map +1 -0
- package/dist/components/date/index.mjs +1124 -0
- package/dist/components/date/index.mjs.map +1 -0
- package/dist/components/dialog/index.js.map +1 -1
- package/dist/components/form/index.d.mts +5 -0
- package/dist/components/form/index.d.ts +5 -0
- package/dist/components/form/index.js +100 -0
- package/dist/components/form/index.js.map +1 -0
- package/dist/components/form/index.mjs +64 -0
- package/dist/components/form/index.mjs.map +1 -0
- package/dist/components/icons-and-geometry/index.d.mts +7 -0
- package/dist/components/icons-and-geometry/index.d.ts +7 -0
- package/dist/components/icons-and-geometry/index.js +3955 -0
- package/dist/components/icons-and-geometry/index.js.map +1 -0
- package/dist/components/icons-and-geometry/index.mjs +3939 -0
- package/dist/components/icons-and-geometry/index.mjs.map +1 -0
- package/dist/components/index.d.mts +83 -0
- package/dist/components/index.d.ts +83 -0
- package/dist/components/index.js +15471 -0
- package/dist/components/index.js.map +1 -0
- package/dist/components/index.mjs +15377 -0
- package/dist/components/index.mjs.map +1 -0
- package/dist/components/layout/index.d.mts +18 -0
- package/dist/components/layout/index.d.ts +18 -0
- package/dist/components/layout/index.js +3111 -0
- package/dist/components/layout/index.js.map +1 -0
- package/dist/components/layout/index.mjs +3064 -0
- package/dist/components/layout/index.mjs.map +1 -0
- package/dist/components/loading-states/index.d.mts +12 -0
- package/dist/components/loading-states/index.d.ts +12 -0
- package/dist/components/loading-states/index.js +614 -0
- package/dist/components/loading-states/index.js.map +1 -0
- package/dist/components/loading-states/index.mjs +573 -0
- package/dist/components/loading-states/index.mjs.map +1 -0
- package/dist/components/navigation/index.d.mts +9 -0
- package/dist/components/navigation/index.d.ts +9 -0
- package/dist/components/navigation/index.js +4660 -0
- package/dist/components/navigation/index.js.map +1 -0
- package/dist/components/navigation/index.mjs +4648 -0
- package/dist/components/navigation/index.mjs.map +1 -0
- package/dist/components/properties/index.d.mts +12 -0
- package/dist/components/properties/index.d.ts +12 -0
- package/dist/components/properties/index.js +2983 -0
- package/dist/components/properties/index.js.map +1 -0
- package/dist/components/properties/index.mjs +2951 -0
- package/dist/components/properties/index.mjs.map +1 -0
- package/dist/components/table/index.d.mts +10 -0
- package/dist/components/table/index.d.ts +10 -0
- package/dist/components/table/index.js +2329 -0
- package/dist/components/table/index.js.map +1 -0
- package/dist/components/table/index.mjs +2293 -0
- package/dist/components/table/index.mjs.map +1 -0
- package/dist/components/user-action/index.d.mts +30 -0
- package/dist/components/user-action/index.d.ts +30 -0
- package/dist/components/user-action/index.js +4257 -0
- package/dist/components/user-action/index.js.map +1 -0
- package/dist/components/user-action/index.mjs +4195 -0
- package/dist/components/user-action/index.mjs.map +1 -0
- package/dist/components/user-action/input/index.d.mts +6 -0
- package/dist/components/user-action/input/index.d.ts +6 -0
- package/dist/components/user-action/input/index.js +398 -0
- package/dist/components/user-action/input/index.js.map +1 -0
- package/dist/components/user-action/input/index.mjs +357 -0
- package/dist/components/user-action/input/index.mjs.map +1 -0
- package/dist/components/user-action/select/index.d.mts +4 -0
- package/dist/components/user-action/select/index.d.ts +4 -0
- package/dist/components/user-action/select/index.js +1369 -0
- package/dist/components/user-action/select/index.js.map +1 -0
- package/dist/components/user-action/select/index.mjs +1333 -0
- package/dist/components/user-action/select/index.mjs.map +1 -0
- package/dist/components/utils/index.d.mts +4 -0
- package/dist/components/utils/index.d.ts +4 -0
- package/dist/components/utils/index.js +302 -0
- package/dist/components/utils/index.js.map +1 -0
- package/dist/components/utils/index.mjs +275 -0
- package/dist/components/utils/index.mjs.map +1 -0
- package/dist/hooks/focus/index.d.mts +6 -0
- package/dist/hooks/focus/index.d.ts +6 -0
- package/dist/hooks/focus/index.js +379 -0
- package/dist/hooks/focus/index.js.map +1 -0
- package/dist/hooks/focus/index.mjs +339 -0
- package/dist/hooks/focus/index.mjs.map +1 -0
- package/dist/hooks/index.d.mts +16 -0
- package/dist/hooks/index.d.ts +16 -0
- package/dist/hooks/index.js +844 -0
- package/dist/hooks/index.js.map +1 -0
- package/dist/hooks/index.mjs +794 -0
- package/dist/hooks/index.mjs.map +1 -0
- package/dist/index.d.mts +110 -0
- package/dist/index.d.ts +110 -0
- package/dist/index.js +16101 -0
- package/dist/index.js.map +1 -0
- package/dist/index.mjs +15941 -0
- package/dist/index.mjs.map +1 -0
- package/dist/localization/defaults/index.d.mts +4 -0
- package/dist/localization/defaults/index.d.ts +4 -0
- package/dist/localization/defaults/index.js +223 -0
- package/dist/localization/defaults/index.js.map +1 -0
- package/dist/localization/defaults/index.mjs +195 -0
- package/dist/localization/defaults/index.mjs.map +1 -0
- package/dist/localization/index.d.mts +7 -0
- package/dist/localization/index.d.ts +7 -0
- package/dist/localization/index.js +415 -0
- package/dist/localization/index.js.map +1 -0
- package/dist/localization/index.mjs +380 -0
- package/dist/localization/index.mjs.map +1 -0
- package/dist/theming/index.d.mts +5 -0
- package/dist/theming/index.d.ts +5 -0
- package/dist/theming/index.js +174 -0
- package/dist/theming/index.js.map +1 -0
- package/dist/theming/index.mjs +145 -0
- package/dist/theming/index.mjs.map +1 -0
- package/dist/utils/index.d.mts +15 -0
- package/dist/utils/index.d.ts +15 -0
- package/dist/utils/index.js +553 -0
- package/dist/utils/index.js.map +1 -0
- package/dist/utils/index.mjs +493 -0
- package/dist/utils/index.mjs.map +1 -0
- package/package.json +25 -24
|
@@ -0,0 +1,100 @@
|
|
|
1
|
+
var __create = Object.create;
|
|
2
|
+
var __defProp = Object.defineProperty;
|
|
3
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
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 __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
20
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
21
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
22
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
23
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
24
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
25
|
+
mod
|
|
26
|
+
));
|
|
27
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
28
|
+
|
|
29
|
+
// src/components/form/index.ts
|
|
30
|
+
var form_exports = {};
|
|
31
|
+
__export(form_exports, {
|
|
32
|
+
FormElementWrapper: () => FormElementWrapper
|
|
33
|
+
});
|
|
34
|
+
module.exports = __toCommonJS(form_exports);
|
|
35
|
+
|
|
36
|
+
// src/components/form/FormElementWrapper.tsx
|
|
37
|
+
var import_react = require("react");
|
|
38
|
+
var import_clsx2 = require("clsx");
|
|
39
|
+
|
|
40
|
+
// src/components/user-action/Label.tsx
|
|
41
|
+
var import_clsx = __toESM(require("clsx"));
|
|
42
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
|
43
|
+
var styleMapping = {
|
|
44
|
+
sm: "typography-label-xs color-label-text",
|
|
45
|
+
md: "typography-label-md color-label-text"
|
|
46
|
+
};
|
|
47
|
+
var Label = ({
|
|
48
|
+
children,
|
|
49
|
+
size = "md",
|
|
50
|
+
className,
|
|
51
|
+
...props
|
|
52
|
+
}) => {
|
|
53
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("label", { ...props, className: (0, import_clsx.default)(styleMapping[size], className), children });
|
|
54
|
+
};
|
|
55
|
+
|
|
56
|
+
// src/components/form/FormElementWrapper.tsx
|
|
57
|
+
var import_jsx_runtime2 = require("react/jsx-runtime");
|
|
58
|
+
var FormElementWrapper = ({
|
|
59
|
+
children,
|
|
60
|
+
id,
|
|
61
|
+
required = false,
|
|
62
|
+
disabled = false,
|
|
63
|
+
label,
|
|
64
|
+
labelProps,
|
|
65
|
+
error,
|
|
66
|
+
errorProps,
|
|
67
|
+
description,
|
|
68
|
+
descriptionProps,
|
|
69
|
+
containerClassName
|
|
70
|
+
}) => {
|
|
71
|
+
const generatedId = (0, import_react.useId)();
|
|
72
|
+
const usedId = id ?? generatedId;
|
|
73
|
+
const describedBy = [
|
|
74
|
+
description ? `${usedId}-description` : void 0,
|
|
75
|
+
error ? `${usedId}-error` : void 0
|
|
76
|
+
].filter(Boolean).join(" ");
|
|
77
|
+
const labeledBy = label ? `${usedId}-label` : void 0;
|
|
78
|
+
const bag = {
|
|
79
|
+
"disabled": disabled,
|
|
80
|
+
"invalid": !!error,
|
|
81
|
+
"required": required,
|
|
82
|
+
"id": usedId,
|
|
83
|
+
"aria-describedby": describedBy,
|
|
84
|
+
"aria-labelby": labeledBy
|
|
85
|
+
};
|
|
86
|
+
return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: (0, import_clsx2.clsx)("flex flex-col gap-y-1", containerClassName), children: [
|
|
87
|
+
label && /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(Label, { htmlFor: usedId, className: (0, import_clsx2.clsx)("typography-label-md", labelProps?.className), children: [
|
|
88
|
+
label,
|
|
89
|
+
required && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { role: "none", className: "text-primary font-bold", children: "*" })
|
|
90
|
+
] }),
|
|
91
|
+
description && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("p", { ...descriptionProps, className: (0, import_clsx2.clsx)("text-description text-xs", descriptionProps?.className), children: description }),
|
|
92
|
+
children(bag),
|
|
93
|
+
error && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("p", { ...errorProps, role: "alert", className: (0, import_clsx2.clsx)("text-negative text-sm font-medium", errorProps), children: error })
|
|
94
|
+
] });
|
|
95
|
+
};
|
|
96
|
+
// Annotate the CommonJS export names for ESM import in node:
|
|
97
|
+
0 && (module.exports = {
|
|
98
|
+
FormElementWrapper
|
|
99
|
+
});
|
|
100
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/components/form/index.ts","../../../src/components/form/FormElementWrapper.tsx","../../../src/components/user-action/Label.tsx"],"sourcesContent":["export * from './FormElementWrapper'\n","import type { HTMLAttributes, ReactNode } from 'react'\nimport { useId } from 'react'\nimport { clsx } from 'clsx'\nimport type { BagFunction } from '@/src/utils/bagFunctions'\nimport type { LabelProps } from '@/src/components/user-action/Label'\nimport { Label } from '@/src/components/user-action/Label'\n\ntype FormElementWrapperBag = {\n 'invalid': boolean,\n 'required': boolean,\n 'disabled': boolean,\n 'aria-describedby': string,\n 'aria-labelby': string,\n 'id': string,\n}\n\nexport type FormElementWrapperProps = {\n children: BagFunction<FormElementWrapperBag>,\n id?: string,\n required: boolean,\n disabled: boolean,\n label?: ReactNode,\n labelProps?: Omit<LabelProps, 'children'>,\n error?: ReactNode,\n errorProps?: Omit<HTMLAttributes<HTMLParagraphElement>, 'children'>,\n description?: ReactNode,\n descriptionProps?: Omit<HTMLAttributes<HTMLParagraphElement>, 'children'>,\n containerClassName?: string,\n}\n\nexport const FormElementWrapper = ({\n children,\n id,\n required = false,\n disabled = false,\n label,\n labelProps,\n error,\n errorProps,\n description,\n descriptionProps,\n containerClassName,\n }: FormElementWrapperProps) => {\n const generatedId = useId()\n const usedId = id ?? generatedId\n\n const describedBy: string = [\n description ? `${usedId}-description` : undefined,\n error ? `${usedId}-error` : undefined,\n ].filter(Boolean).join(' ')\n\n const labeledBy = label ? `${usedId}-label` : undefined\n\n const bag: FormElementWrapperBag = {\n 'disabled': disabled,\n 'invalid': !!error,\n 'required': required,\n 'id': usedId,\n 'aria-describedby': describedBy,\n 'aria-labelby': labeledBy\n }\n\n return (\n <div className={clsx('flex flex-col gap-y-1', containerClassName)}>\n {label && (\n <Label htmlFor={usedId} className={clsx('typography-label-md', labelProps?.className)}>\n {label}\n {required && <span role=\"none\" className=\"text-primary font-bold\">*</span>}\n </Label>\n )}\n {description && (\n <p {...descriptionProps} className={clsx('text-description text-xs', descriptionProps?.className)}>\n {description}\n </p>\n )}\n {children(bag)}\n {error && (\n <p {...errorProps} role=\"alert\" className={clsx('text-negative text-sm font-medium', errorProps)}>\n {error}\n </p>\n )}\n </div>\n )\n}","import clsx from 'clsx'\nimport type { LabelHTMLAttributes } from 'react'\n\nexport type LabelType = 'sm' | 'md'\n\nconst styleMapping: Record<LabelType, string> = {\n sm: 'typography-label-xs color-label-text',\n md: 'typography-label-md color-label-text',\n}\n\nexport type LabelProps = LabelHTMLAttributes<HTMLLabelElement> & {\n /** The size of the label */\n size?: LabelType,\n}\n\n/**\n * A Label component\n */\nexport const Label = ({\n children,\n size = 'md',\n className,\n ...props\n }: LabelProps) => {\n return (\n <label {...props} className={clsx(styleMapping[size], className)}>\n {children}\n </label>\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACCA,mBAAsB;AACtB,IAAAA,eAAqB;;;ACFrB,kBAAiB;AAyBb;AApBJ,IAAM,eAA0C;AAAA,EAC9C,IAAI;AAAA,EACJ,IAAI;AACN;AAUO,IAAM,QAAQ,CAAC;AAAA,EACE;AAAA,EACA,OAAO;AAAA,EACP;AAAA,EACA,GAAG;AACL,MAAkB;AACtC,SACE,4CAAC,WAAO,GAAG,OAAO,eAAW,YAAAC,SAAK,aAAa,IAAI,GAAG,SAAS,GAC5D,UACH;AAEJ;;;ADoCQ,IAAAC,sBAAA;AAnCD,IAAM,qBAAqB,CAAC;AAAA,EACE;AAAA,EACA;AAAA,EACA,WAAW;AAAA,EACX,WAAW;AAAA,EACX;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAA+B;AAChE,QAAM,kBAAc,oBAAM;AAC1B,QAAM,SAAS,MAAM;AAErB,QAAM,cAAsB;AAAA,IAC1B,cAAc,GAAG,MAAM,iBAAiB;AAAA,IACxC,QAAQ,GAAG,MAAM,WAAW;AAAA,EAC9B,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG;AAE1B,QAAM,YAAY,QAAQ,GAAG,MAAM,WAAW;AAE9C,QAAM,MAA6B;AAAA,IACjC,YAAY;AAAA,IACZ,WAAW,CAAC,CAAC;AAAA,IACb,YAAY;AAAA,IACZ,MAAM;AAAA,IACN,oBAAoB;AAAA,IACpB,gBAAgB;AAAA,EAClB;AAEA,SACE,8CAAC,SAAI,eAAW,mBAAK,yBAAyB,kBAAkB,GAC7D;AAAA,aACC,8CAAC,SAAM,SAAS,QAAQ,eAAW,mBAAK,uBAAuB,YAAY,SAAS,GACjF;AAAA;AAAA,MACA,YAAY,6CAAC,UAAK,MAAK,QAAO,WAAU,0BAAyB,eAAC;AAAA,OACrE;AAAA,IAED,eACC,6CAAC,OAAG,GAAG,kBAAkB,eAAW,mBAAK,4BAA4B,kBAAkB,SAAS,GAC7F,uBACH;AAAA,IAED,SAAS,GAAG;AAAA,IACZ,SACC,6CAAC,OAAG,GAAG,YAAY,MAAK,SAAQ,eAAW,mBAAK,qCAAqC,UAAU,GAC5F,iBACH;AAAA,KAEJ;AAEJ;","names":["import_clsx","clsx","import_jsx_runtime"]}
|
|
@@ -0,0 +1,64 @@
|
|
|
1
|
+
// src/components/form/FormElementWrapper.tsx
|
|
2
|
+
import { useId } from "react";
|
|
3
|
+
import { clsx as clsx2 } from "clsx";
|
|
4
|
+
|
|
5
|
+
// src/components/user-action/Label.tsx
|
|
6
|
+
import clsx from "clsx";
|
|
7
|
+
import { jsx } from "react/jsx-runtime";
|
|
8
|
+
var styleMapping = {
|
|
9
|
+
sm: "typography-label-xs color-label-text",
|
|
10
|
+
md: "typography-label-md color-label-text"
|
|
11
|
+
};
|
|
12
|
+
var Label = ({
|
|
13
|
+
children,
|
|
14
|
+
size = "md",
|
|
15
|
+
className,
|
|
16
|
+
...props
|
|
17
|
+
}) => {
|
|
18
|
+
return /* @__PURE__ */ jsx("label", { ...props, className: clsx(styleMapping[size], className), children });
|
|
19
|
+
};
|
|
20
|
+
|
|
21
|
+
// src/components/form/FormElementWrapper.tsx
|
|
22
|
+
import { jsx as jsx2, jsxs } from "react/jsx-runtime";
|
|
23
|
+
var FormElementWrapper = ({
|
|
24
|
+
children,
|
|
25
|
+
id,
|
|
26
|
+
required = false,
|
|
27
|
+
disabled = false,
|
|
28
|
+
label,
|
|
29
|
+
labelProps,
|
|
30
|
+
error,
|
|
31
|
+
errorProps,
|
|
32
|
+
description,
|
|
33
|
+
descriptionProps,
|
|
34
|
+
containerClassName
|
|
35
|
+
}) => {
|
|
36
|
+
const generatedId = useId();
|
|
37
|
+
const usedId = id ?? generatedId;
|
|
38
|
+
const describedBy = [
|
|
39
|
+
description ? `${usedId}-description` : void 0,
|
|
40
|
+
error ? `${usedId}-error` : void 0
|
|
41
|
+
].filter(Boolean).join(" ");
|
|
42
|
+
const labeledBy = label ? `${usedId}-label` : void 0;
|
|
43
|
+
const bag = {
|
|
44
|
+
"disabled": disabled,
|
|
45
|
+
"invalid": !!error,
|
|
46
|
+
"required": required,
|
|
47
|
+
"id": usedId,
|
|
48
|
+
"aria-describedby": describedBy,
|
|
49
|
+
"aria-labelby": labeledBy
|
|
50
|
+
};
|
|
51
|
+
return /* @__PURE__ */ jsxs("div", { className: clsx2("flex flex-col gap-y-1", containerClassName), children: [
|
|
52
|
+
label && /* @__PURE__ */ jsxs(Label, { htmlFor: usedId, className: clsx2("typography-label-md", labelProps?.className), children: [
|
|
53
|
+
label,
|
|
54
|
+
required && /* @__PURE__ */ jsx2("span", { role: "none", className: "text-primary font-bold", children: "*" })
|
|
55
|
+
] }),
|
|
56
|
+
description && /* @__PURE__ */ jsx2("p", { ...descriptionProps, className: clsx2("text-description text-xs", descriptionProps?.className), children: description }),
|
|
57
|
+
children(bag),
|
|
58
|
+
error && /* @__PURE__ */ jsx2("p", { ...errorProps, role: "alert", className: clsx2("text-negative text-sm font-medium", errorProps), children: error })
|
|
59
|
+
] });
|
|
60
|
+
};
|
|
61
|
+
export {
|
|
62
|
+
FormElementWrapper
|
|
63
|
+
};
|
|
64
|
+
//# sourceMappingURL=index.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/components/form/FormElementWrapper.tsx","../../../src/components/user-action/Label.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from 'react'\nimport { useId } from 'react'\nimport { clsx } from 'clsx'\nimport type { BagFunction } from '@/src/utils/bagFunctions'\nimport type { LabelProps } from '@/src/components/user-action/Label'\nimport { Label } from '@/src/components/user-action/Label'\n\ntype FormElementWrapperBag = {\n 'invalid': boolean,\n 'required': boolean,\n 'disabled': boolean,\n 'aria-describedby': string,\n 'aria-labelby': string,\n 'id': string,\n}\n\nexport type FormElementWrapperProps = {\n children: BagFunction<FormElementWrapperBag>,\n id?: string,\n required: boolean,\n disabled: boolean,\n label?: ReactNode,\n labelProps?: Omit<LabelProps, 'children'>,\n error?: ReactNode,\n errorProps?: Omit<HTMLAttributes<HTMLParagraphElement>, 'children'>,\n description?: ReactNode,\n descriptionProps?: Omit<HTMLAttributes<HTMLParagraphElement>, 'children'>,\n containerClassName?: string,\n}\n\nexport const FormElementWrapper = ({\n children,\n id,\n required = false,\n disabled = false,\n label,\n labelProps,\n error,\n errorProps,\n description,\n descriptionProps,\n containerClassName,\n }: FormElementWrapperProps) => {\n const generatedId = useId()\n const usedId = id ?? generatedId\n\n const describedBy: string = [\n description ? `${usedId}-description` : undefined,\n error ? `${usedId}-error` : undefined,\n ].filter(Boolean).join(' ')\n\n const labeledBy = label ? `${usedId}-label` : undefined\n\n const bag: FormElementWrapperBag = {\n 'disabled': disabled,\n 'invalid': !!error,\n 'required': required,\n 'id': usedId,\n 'aria-describedby': describedBy,\n 'aria-labelby': labeledBy\n }\n\n return (\n <div className={clsx('flex flex-col gap-y-1', containerClassName)}>\n {label && (\n <Label htmlFor={usedId} className={clsx('typography-label-md', labelProps?.className)}>\n {label}\n {required && <span role=\"none\" className=\"text-primary font-bold\">*</span>}\n </Label>\n )}\n {description && (\n <p {...descriptionProps} className={clsx('text-description text-xs', descriptionProps?.className)}>\n {description}\n </p>\n )}\n {children(bag)}\n {error && (\n <p {...errorProps} role=\"alert\" className={clsx('text-negative text-sm font-medium', errorProps)}>\n {error}\n </p>\n )}\n </div>\n )\n}","import clsx from 'clsx'\nimport type { LabelHTMLAttributes } from 'react'\n\nexport type LabelType = 'sm' | 'md'\n\nconst styleMapping: Record<LabelType, string> = {\n sm: 'typography-label-xs color-label-text',\n md: 'typography-label-md color-label-text',\n}\n\nexport type LabelProps = LabelHTMLAttributes<HTMLLabelElement> & {\n /** The size of the label */\n size?: LabelType,\n}\n\n/**\n * A Label component\n */\nexport const Label = ({\n children,\n size = 'md',\n className,\n ...props\n }: LabelProps) => {\n return (\n <label {...props} className={clsx(styleMapping[size], className)}>\n {children}\n </label>\n )\n}\n"],"mappings":";AACA,SAAS,aAAa;AACtB,SAAS,QAAAA,aAAY;;;ACFrB,OAAO,UAAU;AAyBb;AApBJ,IAAM,eAA0C;AAAA,EAC9C,IAAI;AAAA,EACJ,IAAI;AACN;AAUO,IAAM,QAAQ,CAAC;AAAA,EACE;AAAA,EACA,OAAO;AAAA,EACP;AAAA,EACA,GAAG;AACL,MAAkB;AACtC,SACE,oBAAC,WAAO,GAAG,OAAO,WAAW,KAAK,aAAa,IAAI,GAAG,SAAS,GAC5D,UACH;AAEJ;;;ADoCQ,SAEe,OAAAC,MAFf;AAnCD,IAAM,qBAAqB,CAAC;AAAA,EACE;AAAA,EACA;AAAA,EACA,WAAW;AAAA,EACX,WAAW;AAAA,EACX;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAA+B;AAChE,QAAM,cAAc,MAAM;AAC1B,QAAM,SAAS,MAAM;AAErB,QAAM,cAAsB;AAAA,IAC1B,cAAc,GAAG,MAAM,iBAAiB;AAAA,IACxC,QAAQ,GAAG,MAAM,WAAW;AAAA,EAC9B,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG;AAE1B,QAAM,YAAY,QAAQ,GAAG,MAAM,WAAW;AAE9C,QAAM,MAA6B;AAAA,IACjC,YAAY;AAAA,IACZ,WAAW,CAAC,CAAC;AAAA,IACb,YAAY;AAAA,IACZ,MAAM;AAAA,IACN,oBAAoB;AAAA,IACpB,gBAAgB;AAAA,EAClB;AAEA,SACE,qBAAC,SAAI,WAAWC,MAAK,yBAAyB,kBAAkB,GAC7D;AAAA,aACC,qBAAC,SAAM,SAAS,QAAQ,WAAWA,MAAK,uBAAuB,YAAY,SAAS,GACjF;AAAA;AAAA,MACA,YAAY,gBAAAD,KAAC,UAAK,MAAK,QAAO,WAAU,0BAAyB,eAAC;AAAA,OACrE;AAAA,IAED,eACC,gBAAAA,KAAC,OAAG,GAAG,kBAAkB,WAAWC,MAAK,4BAA4B,kBAAkB,SAAS,GAC7F,uBACH;AAAA,IAED,SAAS,GAAG;AAAA,IACZ,SACC,gBAAAD,KAAC,OAAG,GAAG,YAAY,MAAK,SAAQ,WAAWC,MAAK,qCAAqC,UAAU,GAC5F,iBACH;AAAA,KAEJ;AAEJ;","names":["clsx","jsx","clsx"]}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
export { Avatar, AvatarGroup, AvatarGroupProps, AvatarProps, AvatarSize, AvatarUtil } from './Avatar.mjs';
|
|
2
|
+
export { Circle, CircleProps } from './Circle.mjs';
|
|
3
|
+
export { HelpwaveLogo, HelpwaveProps } from './HelpwaveLogo.mjs';
|
|
4
|
+
export { AnimatedRing, AnimatedRingProps, RadialRings, RadialRingsProps, Ring, RingProps, RingWave, RingWaveProps } from './Ring.mjs';
|
|
5
|
+
export { TagIcon, TagProps } from './Tag.mjs';
|
|
6
|
+
import 'react/jsx-runtime';
|
|
7
|
+
import 'react';
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
export { Avatar, AvatarGroup, AvatarGroupProps, AvatarProps, AvatarSize, AvatarUtil } from './Avatar.js';
|
|
2
|
+
export { Circle, CircleProps } from './Circle.js';
|
|
3
|
+
export { HelpwaveLogo, HelpwaveProps } from './HelpwaveLogo.js';
|
|
4
|
+
export { AnimatedRing, AnimatedRingProps, RadialRings, RadialRingsProps, Ring, RingProps, RingWave, RingWaveProps } from './Ring.js';
|
|
5
|
+
export { TagIcon, TagProps } from './Tag.js';
|
|
6
|
+
import 'react/jsx-runtime';
|
|
7
|
+
import 'react';
|