@g4rcez/components 3.0.1 → 3.0.2

package/dist/input-field-DTeIrwpK.js

@@ -0,0 +1,146 @@
+import { jsxs as t, jsx as e } from "react/jsx-runtime";
+import { useContext as S, forwardRef as $, Fragment as x } from "react";
+import { u as D } from "./use-translations-BwLKTrZv.js";
+import { C as _, a as B } from "./context-BFXNJVn2.js";
+import { c as h } from "./dom-Dl8XH0CK.js";
+import { Tooltip as O } from "./components/floating/tooltip.js";
+import { I as R } from "./info-N5jWZg2A.js";
+import { C as X } from "./circle-check-big-3M5lhTxx.js";
+import { c as A } from "./createLucideIcon-CP-mMPfa.js";
+const E = [
+  ["circle", { cx: "12", cy: "12", r: "10", key: "1mglay" }],
+  ["path", { d: "m15 9-6 6", key: "1uzhvr" }],
+  ["path", { d: "m9 9 6 6", key: "z0biqf" }]
+], G = A("circle-x", E), H = () => {
+  const a = S(_);
+  return a ? a.tweaks : B;
+}, J = ({ reportStatus: a, id: s, hideLeft: o = !1, className: n, info: r, children: i, title: l }) => /* @__PURE__ */ t("span", { className: h("w-full justify-between", o && i === null ? "hidden" : "flex", n), children: [
+  o ? null : /* @__PURE__ */ t("span", { className: "flex items-center gap-1 transition-colors group-focus-within:text-primary group-hover:text-primary group-disabled:text-disabled group-error:text-danger", children: [
+    l,
+    a || r ? /* @__PURE__ */ t("span", { className: "flex items-center justify-center gap-1", children: [
+      r ? /* @__PURE__ */ e(
+        O,
+        {
+          as: "button",
+          type: "button",
+          "aria-label": typeof r == "string" ? r : void 0,
+          "aria-describedby": typeof r == "string" ? void 0 : s ? `tooltip-info-content-${s}` : void 0,
+          title: /* @__PURE__ */ e("span", { className: "cursor-help", children: /* @__PURE__ */ e(R, { className: "aspect-square size-3", "aria-hidden": "true", size: 16, strokeWidth: 1, absoluteStrokeWidth: !0 }) }),
+          children: /* @__PURE__ */ e(
+            "div",
+            {
+              id: s ? `tooltip-info-content-${s}` : void 0,
+              className: "w-full max-w-48 whitespace-break-spaces break-words",
+              children: r
+            }
+          )
+        }
+      ) : null,
+      a ? /* @__PURE__ */ t("span", { className: "flex h-3 min-w-6 items-center", children: [
+        /* @__PURE__ */ e(
+          X,
+          {
+            className: "hidden aspect-square size-3 opacity-0 transition-opacity group-assert:block group-assert:text-success group-assert:opacity-100",
+            "aria-hidden": "true",
+            size: 16,
+            strokeWidth: 1,
+            absoluteStrokeWidth: !0
+          }
+        ),
+        /* @__PURE__ */ e(
+          G,
+          {
+            className: "hidden aspect-square size-3 opacity-0 transition-opacity group-error:block group-error:opacity-100",
+            "aria-hidden": "true",
+            size: 16,
+            strokeWidth: 1,
+            absoluteStrokeWidth: !0
+          }
+        )
+      ] }) : null
+    ] }) : null
+  ] }),
+  i
+] }), ee = $(
+  ({
+    optionalText: a,
+    left: s,
+    rightLabel: o,
+    container: n,
+    feedback: r,
+    interactive: i,
+    right: l,
+    info: f,
+    children: g,
+    error: c,
+    form: d,
+    id: b,
+    labelClassName: w = "",
+    name: y,
+    title: k,
+    componentName: N,
+    placeholder: v,
+    hideLeft: z = !1,
+    required: C,
+    disabled: p,
+    reportStatus: u,
+    hiddenLabel: I
+  }, T) => {
+    const W = H(), j = u !== void 0 ? u : W.input.iconFeedback, F = b ?? y, q = D(), m = a ?? q.inputOptionalLabel;
+    return /* @__PURE__ */ t(
+      "fieldset",
+      {
+        ref: T,
+        form: d,
+        disabled: p,
+        "data-error": !!c,
+        "aria-disabled": p,
+        "data-component": N,
+        "data-interactive": !!i,
+        className: h("group flex min-h-0 min-w-0 max-w-full flex-col items-start", n),
+        children: [
+          /* @__PURE__ */ t(
+            "label",
+            {
+              form: d,
+              htmlFor: F,
+              className: "relative inline-flex w-full max-w-full cursor-text flex-row flex-wrap justify-between gap-1 text-field-label text-sm transition-colors empty:hidden group-disabled:cursor-not-allowed group-error:text-danger",
+              children: [
+                I ? null : /* @__PURE__ */ e(J, { info: f, hideLeft: z, reportStatus: j, title: k, placeholder: v, children: m || o ? /* @__PURE__ */ t(x, { children: [
+                  C ? null : /* @__PURE__ */ e(
+                    "span",
+                    {
+                      "aria-disabled": p,
+                      className: "text-opacity-70 transition-colors group-focus-within:text-primary group-hover:text-primary aria-disabled:text-disabled",
+                      children: m
+                    }
+                  ),
+                  o ? /* @__PURE__ */ e(x, { children: o }) : null
+                ] }) : null }),
+                /* @__PURE__ */ t(
+                  "div",
+                  {
+                    className: `group relative flex w-full flex-row flex-nowrap items-center gap-x-2 gap-y-1 rounded-md border border-input-border bg-transparent transition-colors group-hover:border-primary group-disabled:border-disabled group-error:border-danger ${w}`,
+                    children: [
+                      s ? /* @__PURE__ */ e("span", { className: "flex flex-nowrap gap-1 whitespace-nowrap pl-2", children: s }) : null,
+                      g,
+                      l ? /* @__PURE__ */ e("span", { className: "flex flex-nowrap gap-2 whitespace-nowrap pr-2", children: l }) : null
+                    ]
+                  }
+                )
+              ]
+            }
+          ),
+          /* @__PURE__ */ e("p", { className: "mt-input-gap hidden whitespace-pre-wrap text-wrap text-xs empty:mt-0 empty:hidden group-has-[input:not(:focus):invalid[data-initialized=true]]:flex group-error:flex group-error:text-danger", children: c }),
+          /* @__PURE__ */ e("p", { className: "mt-input-gap text-xs empty:mt-0 empty:hidden group-has-[input:not(:focus):valid[data-initialized=true]]:block group-assert:block group-error:hidden", children: r })
+        ]
+      }
+    );
+  }
+);
+export {
+  ee as I,
+  J as a,
+  H as u
+};
+//# sourceMappingURL=input-field-DTeIrwpK.js.map

package/dist/input-field-DTeIrwpK.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"input-field-DTeIrwpK.js","sources":["../../../node_modules/.pnpm/lucide-react@0.575.0_react@19.2.3/node_modules/lucide-react/dist/esm/icons/circle-x.js","../src/hooks/use-tweaks.ts","../src/components/form/input-field.tsx"],"sourcesContent":["/**\n * @license lucide-react v0.575.0 - ISC\n *\n * This source code is licensed under the ISC license.\n * See the LICENSE file in the root directory of this source tree.\n */\n\nimport createLucideIcon from '../createLucideIcon.js';\n\nconst __iconNode = [\n  [\"circle\", { cx: \"12\", cy: \"12\", r: \"10\", key: \"1mglay\" }],\n  [\"path\", { d: \"m15 9-6 6\", key: \"1uzhvr\" }],\n  [\"path\", { d: \"m9 9 6 6\", key: \"z0biqf\" }]\n];\nconst CircleX = createLucideIcon(\"circle-x\", __iconNode);\n\nexport { __iconNode, CircleX as default };\n//# sourceMappingURL=circle-x.js.map\n","import { useContext } from \"react\";\nimport { Context } from \"../config/context\";\nimport { defaultTweaks, Tweaks } from \"../config/default-tweaks\";\n\nexport const useTweaks = (): Tweaks => {\n    const ctx = useContext(Context);\n    if (!ctx) return defaultTweaks;\n    return ctx.tweaks!;\n};\n","\"use client\";\nimport { CheckCircle, InfoIcon, XCircle } from \"lucide-react\";\nimport React, { forwardRef, Fragment, type PropsWithChildren } from \"react\";\nimport { useTranslations } from \"../../hooks/use-translations\";\nimport { useTweaks } from \"../../hooks/use-tweaks\";\nimport { css } from \"../../lib/dom\";\nimport { type Label, Override } from \"../../types\";\nimport { type PolymorphicProps } from \"../core/polymorph\";\nimport { Tooltip } from \"../floating/tooltip\";\n\nexport type FeedbackProps = React.PropsWithChildren<\n    Partial<{\n        id: string;\n        info: Label;\n        title: Label;\n        hideLeft: boolean;\n        className: string;\n        placeholder: string;\n        reportStatus: boolean;\n        hiddenLabel: boolean;\n    }>\n>;\n\nexport const InputFeedback = ({ reportStatus, id, hideLeft = false, className, info, children, title }: FeedbackProps) => (\n    <span className={css(\"w-full justify-between\", hideLeft && children === null ? \"hidden\" : \"flex\", className)}>\n        {hideLeft ? null : (\n            <span className=\"flex items-center gap-1 transition-colors group-focus-within:text-primary group-hover:text-primary group-disabled:text-disabled group-error:text-danger\">\n                {title}\n                {reportStatus || info ? (\n                    <span className=\"flex items-center justify-center gap-1\">\n                        {info ? (\n                            <Tooltip\n                                as=\"button\"\n                                type=\"button\"\n                                aria-label={typeof info === \"string\" ? info : undefined}\n                                aria-describedby={typeof info === \"string\" ? undefined : id ? `tooltip-info-content-${id}` : undefined}\n                                title={\n                                    <span className=\"cursor-help\">\n                                        <InfoIcon className=\"aspect-square size-3\" aria-hidden=\"true\" size={16} strokeWidth={1} absoluteStrokeWidth />\n                                    </span>\n                                }\n                            >\n                                <div\n                                    id={id ? `tooltip-info-content-${id}` : undefined}\n                                    className=\"w-full max-w-48 whitespace-break-spaces break-words\"\n                                >\n                                    {info}\n                                </div>\n                            </Tooltip>\n                        ) : null}\n                        {reportStatus ? (\n                            <span className=\"flex h-3 min-w-6 items-center\">\n                                <CheckCircle\n                                    className=\"hidden aspect-square size-3 opacity-0 transition-opacity group-assert:block group-assert:text-success group-assert:opacity-100\"\n                                    aria-hidden=\"true\"\n                                    size={16}\n                                    strokeWidth={1}\n                                    absoluteStrokeWidth\n                                />\n                                <XCircle\n                                    className=\"hidden aspect-square size-3 opacity-0 transition-opacity group-error:block group-error:opacity-100\"\n                                    aria-hidden=\"true\"\n                                    size={16}\n                                    strokeWidth={1}\n                                    absoluteStrokeWidth\n                                />\n                            </span>\n                        ) : null}\n                    </span>\n                ) : null}\n            </span>\n        )}\n        {children}\n    </span>\n);\n\nexport type InputFieldProps<T extends \"input\" | \"select\" | \"textarea\"> = PolymorphicProps<\n    Partial<\n        Override<\n            FeedbackProps,\n            {\n                loading: boolean;\n                componentName: string;\n                info: Label;\n                labelClassName: string;\n                error: string;\n                hideLeft: boolean;\n                interactive: boolean;\n                container: string;\n                left: Label;\n                feedback: Label;\n                optionalText: string;\n                right: Label;\n                rightLabel: Label;\n                id: string;\n                name: string;\n                placeholder: string;\n            }\n        >\n    >,\n    T\n>;\n\nexport const InputField: <T extends \"input\" | \"select\" | \"textarea\">(props: PropsWithChildren<InputFieldProps<T>>) => React.ReactElement = forwardRef(\n    <T extends \"input\" | \"select\" | \"textarea\">(\n        {\n            optionalText: _optionalText,\n            left,\n            rightLabel,\n            container,\n            feedback,\n            interactive,\n            right,\n            info,\n            children,\n            error,\n            form,\n            id,\n            labelClassName = \"\",\n            name,\n            title,\n            componentName,\n            placeholder,\n            hideLeft = false,\n            required,\n            disabled,\n            reportStatus,\n            hiddenLabel,\n        }: PropsWithChildren<InputFieldProps<T>>,\n        ref: any\n    ) => {\n        const tweaks = useTweaks();\n        const reportStatusDefault = reportStatus !== undefined ? reportStatus : tweaks.input.iconFeedback;\n        const ID = id ?? name;\n        const translation = useTranslations();\n        const optionalText = _optionalText ?? translation.inputOptionalLabel;\n        return (\n            <fieldset\n                ref={ref}\n                form={form}\n                disabled={disabled}\n                data-error={!!error}\n                aria-disabled={disabled}\n                data-component={componentName}\n                data-interactive={!!interactive}\n                className={css(\"group flex min-h-0 min-w-0 max-w-full flex-col items-start\", container)}\n            >\n                <label\n                    form={form}\n                    htmlFor={ID}\n                    className=\"relative inline-flex w-full max-w-full cursor-text flex-row flex-wrap justify-between gap-1 text-field-label text-sm transition-colors empty:hidden group-disabled:cursor-not-allowed group-error:text-danger\"\n                >\n                    {hiddenLabel ? null : (\n                        <InputFeedback info={info} hideLeft={hideLeft} reportStatus={reportStatusDefault} title={title} placeholder={placeholder}>\n                            {optionalText || rightLabel ? (\n                                <Fragment>\n                                    {!required ? (\n                                        <span\n                                            aria-disabled={disabled}\n                                            className=\"text-opacity-70 transition-colors group-focus-within:text-primary group-hover:text-primary aria-disabled:text-disabled\"\n                                        >\n                                            {optionalText}\n                                        </span>\n                                    ) : null}\n                                    {rightLabel ? <Fragment>{rightLabel}</Fragment> : null}\n                                </Fragment>\n                            ) : null}\n                        </InputFeedback>\n                    )}\n                    <div\n                        className={`group relative flex w-full flex-row flex-nowrap items-center gap-x-2 gap-y-1 rounded-md border border-input-border bg-transparent transition-colors group-hover:border-primary group-disabled:border-disabled group-error:border-danger ${labelClassName}`}\n                    >\n                        {left ? <span className=\"flex flex-nowrap gap-1 whitespace-nowrap pl-2\">{left}</span> : null}\n                        {children}\n                        {right ? <span className=\"flex flex-nowrap gap-2 whitespace-nowrap pr-2\">{right}</span> : null}\n                    </div>\n                </label>\n                <p className=\"mt-input-gap hidden whitespace-pre-wrap text-wrap text-xs empty:mt-0 empty:hidden group-has-[input:not(:focus):invalid[data-initialized=true]]:flex group-error:flex group-error:text-danger\">\n                    {error}\n                </p>\n                <p className=\"mt-input-gap text-xs empty:mt-0 empty:hidden group-has-[input:not(:focus):valid[data-initialized=true]]:block group-assert:block group-error:hidden\">\n                    {feedback}\n                </p>\n            </fieldset>\n        );\n    }\n) as any;\n"],"names":["__iconNode","CircleX","createLucideIcon","useTweaks","ctx","useContext","Context","defaultTweaks","InputFeedback","reportStatus","id","hideLeft","className","info","children","title","jsxs","css","jsx","Tooltip","InfoIcon","CheckCircle","XCircle","InputField","forwardRef","_optionalText","left","rightLabel","container","feedback","interactive","right","error","form","labelClassName","name","componentName","placeholder","required","disabled","hiddenLabel","ref","tweaks","reportStatusDefault","ID","translation","useTranslations","optionalText","Fragment"],"mappings":"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","x_google_ignoreList":[0]}