@glob-ui/field 0.0.0-stage → 0.2.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 Kevin Martínez E
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -1,3 +1,17 @@
-# Temporary Holding Version
+# @glob-ui/field
 
-This version is a temporary placeholder for this package. An operational version to replace this has been submitted for review and is awaiting a staged release.
+Wraps one form control with a label, a description and an error, and wires their ARIA attributes to it.
+
+## Install
+
+```bash
+pnpm add @glob-ui/field
+```
+
+## Documentation
+
+Full docs, examples and the accessibility table: [Field](https://github.com/kevin-martineze/GlobUI/tree/main/apps/docs/content/docs/components/field.mdx).
+
+## License
+
+MIT. See [LICENSE](./LICENSE).

package/dist/index.d.mts

@@ -0,0 +1,17 @@
+import * as react from 'react';
+
+type Size = "sm" | "md" | "lg";
+interface FieldProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "children"> {
+    label?: React.ReactNode;
+    description?: React.ReactNode;
+    /** When truthy, marks the control invalid. The description stays visible. */
+    error?: React.ReactNode;
+    /** Shows the asterisk only. Put `required` on the control too, for validation and screen readers. */
+    required?: boolean;
+    size?: Size;
+    /** One form control. Field injects id, aria-describedby, aria-labelledby and aria-invalid into it. */
+    children: React.ReactElement;
+}
+declare const Field: react.ForwardRefExoticComponent<FieldProps & react.RefAttributes<HTMLDivElement>>;
+
+export { Field, type FieldProps };

package/dist/index.d.ts

@@ -0,0 +1,17 @@
+import * as react from 'react';
+
+type Size = "sm" | "md" | "lg";
+interface FieldProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "children"> {
+    label?: React.ReactNode;
+    description?: React.ReactNode;
+    /** When truthy, marks the control invalid. The description stays visible. */
+    error?: React.ReactNode;
+    /** Shows the asterisk only. Put `required` on the control too, for validation and screen readers. */
+    required?: boolean;
+    size?: Size;
+    /** One form control. Field injects id, aria-describedby, aria-labelledby and aria-invalid into it. */
+    children: React.ReactElement;
+}
+declare const Field: react.ForwardRefExoticComponent<FieldProps & react.RefAttributes<HTMLDivElement>>;
+
+export { Field, type FieldProps };

package/dist/index.js

@@ -0,0 +1,99 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/index.ts
+var index_exports = {};
+__export(index_exports, {
+  Field: () => Field
+});
+module.exports = __toCommonJS(index_exports);
+
+// src/field.tsx
+var import_react = require("react");
+var import_utils = require("@glob-ui/utils");
+var import_label = require("@glob-ui/label");
+var import_jsx_runtime = require("react/jsx-runtime");
+var textSize = {
+  sm: "text-xs",
+  md: "text-sm",
+  lg: "text-base"
+};
+var Field = (0, import_react.forwardRef)(
+  (_a, ref) => {
+    var _b = _a, { label, description, error, required, size = "md", className, children } = _b, props = __objRest(_b, ["label", "description", "error", "required", "size", "className", "children"]);
+    var _a2;
+    const baseId = (0, import_react.useId)();
+    const child = import_react.Children.only(children);
+    const childProps = (0, import_react.isValidElement)(child) ? child.props : {};
+    const controlId = (_a2 = childProps.id) != null ? _a2 : `${baseId}-control`;
+    const labelId = `${baseId}-label`;
+    const descriptionId = `${baseId}-description`;
+    const errorId = `${baseId}-error`;
+    const hasError = Boolean(error);
+    const describedBy = [childProps["aria-describedby"], description ? descriptionId : null, hasError ? errorId : null].filter(Boolean).join(" ") || void 0;
+    const labelledBy = [childProps["aria-labelledby"], label ? labelId : null].filter(Boolean).join(" ") || void 0;
+    const control = (0, import_react.isValidElement)(child) ? (0, import_react.cloneElement)(child, {
+      id: controlId,
+      "aria-describedby": describedBy,
+      "aria-labelledby": labelledBy,
+      "aria-invalid": hasError ? true : childProps["aria-invalid"]
+    }) : child;
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", __spreadProps(__spreadValues({ ref, className: (0, import_utils.cn)("flex flex-col gap-1.5", className) }, props), { children: [
+      label && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_label.Label, { id: labelId, htmlFor: controlId, size, required, children: label }),
+      control,
+      description && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { id: descriptionId, className: (0, import_utils.cn)("text-glob-text-secondary", textSize[size]), children: description }),
+      hasError && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { id: errorId, className: (0, import_utils.cn)("text-glob-danger", textSize[size]), children: error })
+    ] }));
+  }
+);
+Field.displayName = "Field";
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Field
+});
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/index.ts","../src/field.tsx"],"sourcesContent":["export { Field } from \"./field\"\nexport type { FieldProps } from \"./field\"\n","import { Children, cloneElement, forwardRef, isValidElement, useId } from \"react\"\nimport { cn } from \"@glob-ui/utils\"\nimport { Label } from \"@glob-ui/label\"\n\ntype Size = \"sm\" | \"md\" | \"lg\"\n\nconst textSize: Record<Size, string> = {\n  sm: \"text-xs\",\n  md: \"text-sm\",\n  lg: \"text-base\",\n}\n\ninterface ControlProps {\n  id?: string\n  \"aria-describedby\"?: string\n  \"aria-labelledby\"?: string\n  \"aria-invalid\"?: React.AriaAttributes[\"aria-invalid\"]\n}\n\nexport interface FieldProps extends Omit<React.HTMLAttributes<HTMLDivElement>, \"children\"> {\n  label?: React.ReactNode\n  description?: React.ReactNode\n  /** When truthy, marks the control invalid. The description stays visible. */\n  error?: React.ReactNode\n  /** Shows the asterisk only. Put `required` on the control too, for validation and screen readers. */\n  required?: boolean\n  size?: Size\n  /** One form control. Field injects id, aria-describedby, aria-labelledby and aria-invalid into it. */\n  children: React.ReactElement\n}\n\nconst Field = forwardRef<HTMLDivElement, FieldProps>(\n  ({ label, description, error, required, size = \"md\", className, children, ...props }, ref) => {\n    const baseId = useId()\n    const child = Children.only(children)\n    const childProps: ControlProps = isValidElement<ControlProps>(child) ? child.props : {}\n\n    const controlId = childProps.id ?? `${baseId}-control`\n    const labelId = `${baseId}-label`\n    const descriptionId = `${baseId}-description`\n    const errorId = `${baseId}-error`\n    const hasError = Boolean(error)\n\n    const describedBy =\n      [childProps[\"aria-describedby\"], description ? descriptionId : null, hasError ? errorId : null]\n        .filter(Boolean)\n        .join(\" \") || undefined\n\n    const labelledBy =\n      [childProps[\"aria-labelledby\"], label ? labelId : null].filter(Boolean).join(\" \") || undefined\n\n    const control = isValidElement<ControlProps>(child)\n      ? cloneElement(child, {\n          id: controlId,\n          \"aria-describedby\": describedBy,\n          \"aria-labelledby\": labelledBy,\n          \"aria-invalid\": hasError ? true : childProps[\"aria-invalid\"],\n        })\n      : child\n\n    return (\n      <div ref={ref} className={cn(\"flex flex-col gap-1.5\", className)} {...props}>\n        {label && (\n          <Label id={labelId} htmlFor={controlId} size={size} required={required}>\n            {label}\n          </Label>\n        )}\n        {control}\n        {description && (\n          <p id={descriptionId} className={cn(\"text-glob-text-secondary\", textSize[size])}>\n            {description}\n          </p>\n        )}\n        {hasError && (\n          <p id={errorId} className={cn(\"text-glob-danger\", textSize[size])}>\n            {error}\n          </p>\n        )}\n      </div>\n    )\n  }\n)\nField.displayName = \"Field\"\n\nexport { Field }\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,mBAA0E;AAC1E,mBAAmB;AACnB,mBAAsB;AA2DhB;AAvDN,IAAM,WAAiC;AAAA,EACrC,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN;AAqBA,IAAM,YAAQ;AAAA,EACZ,CAAC,IAAqF,QAAQ;AAA7F,iBAAE,SAAO,aAAa,OAAO,UAAU,OAAO,MAAM,WAAW,SAhClE,IAgCG,IAA4E,kBAA5E,IAA4E,CAA1E,SAAO,eAAa,SAAO,YAAU,QAAa,aAAW;AAhClE,QAAAA;AAiCI,UAAM,aAAS,oBAAM;AACrB,UAAM,QAAQ,sBAAS,KAAK,QAAQ;AACpC,UAAM,iBAA2B,6BAA6B,KAAK,IAAI,MAAM,QAAQ,CAAC;AAEtF,UAAM,aAAYA,MAAA,WAAW,OAAX,OAAAA,MAAiB,GAAG,MAAM;AAC5C,UAAM,UAAU,GAAG,MAAM;AACzB,UAAM,gBAAgB,GAAG,MAAM;AAC/B,UAAM,UAAU,GAAG,MAAM;AACzB,UAAM,WAAW,QAAQ,KAAK;AAE9B,UAAM,cACJ,CAAC,WAAW,kBAAkB,GAAG,cAAc,gBAAgB,MAAM,WAAW,UAAU,IAAI,EAC3F,OAAO,OAAO,EACd,KAAK,GAAG,KAAK;AAElB,UAAM,aACJ,CAAC,WAAW,iBAAiB,GAAG,QAAQ,UAAU,IAAI,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG,KAAK;AAEvF,UAAM,cAAU,6BAA6B,KAAK,QAC9C,2BAAa,OAAO;AAAA,MAClB,IAAI;AAAA,MACJ,oBAAoB;AAAA,MACpB,mBAAmB;AAAA,MACnB,gBAAgB,WAAW,OAAO,WAAW,cAAc;AAAA,IAC7D,CAAC,IACD;AAEJ,WACE,6CAAC,sCAAI,KAAU,eAAW,iBAAG,yBAAyB,SAAS,KAAO,QAArE,EACE;AAAA,eACC,4CAAC,sBAAM,IAAI,SAAS,SAAS,WAAW,MAAY,UACjD,iBACH;AAAA,MAED;AAAA,MACA,eACC,4CAAC,OAAE,IAAI,eAAe,eAAW,iBAAG,4BAA4B,SAAS,IAAI,CAAC,GAC3E,uBACH;AAAA,MAED,YACC,4CAAC,OAAE,IAAI,SAAS,eAAW,iBAAG,oBAAoB,SAAS,IAAI,CAAC,GAC7D,iBACH;AAAA,QAEJ;AAAA,EAEJ;AACF;AACA,MAAM,cAAc;","names":["_a"]}

package/dist/index.mjs

@@ -0,0 +1,75 @@
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
+
+// src/field.tsx
+import { Children, cloneElement, forwardRef, isValidElement, useId } from "react";
+import { cn } from "@glob-ui/utils";
+import { Label } from "@glob-ui/label";
+import { jsx, jsxs } from "react/jsx-runtime";
+var textSize = {
+  sm: "text-xs",
+  md: "text-sm",
+  lg: "text-base"
+};
+var Field = forwardRef(
+  (_a, ref) => {
+    var _b = _a, { label, description, error, required, size = "md", className, children } = _b, props = __objRest(_b, ["label", "description", "error", "required", "size", "className", "children"]);
+    var _a2;
+    const baseId = useId();
+    const child = Children.only(children);
+    const childProps = isValidElement(child) ? child.props : {};
+    const controlId = (_a2 = childProps.id) != null ? _a2 : `${baseId}-control`;
+    const labelId = `${baseId}-label`;
+    const descriptionId = `${baseId}-description`;
+    const errorId = `${baseId}-error`;
+    const hasError = Boolean(error);
+    const describedBy = [childProps["aria-describedby"], description ? descriptionId : null, hasError ? errorId : null].filter(Boolean).join(" ") || void 0;
+    const labelledBy = [childProps["aria-labelledby"], label ? labelId : null].filter(Boolean).join(" ") || void 0;
+    const control = isValidElement(child) ? cloneElement(child, {
+      id: controlId,
+      "aria-describedby": describedBy,
+      "aria-labelledby": labelledBy,
+      "aria-invalid": hasError ? true : childProps["aria-invalid"]
+    }) : child;
+    return /* @__PURE__ */ jsxs("div", __spreadProps(__spreadValues({ ref, className: cn("flex flex-col gap-1.5", className) }, props), { children: [
+      label && /* @__PURE__ */ jsx(Label, { id: labelId, htmlFor: controlId, size, required, children: label }),
+      control,
+      description && /* @__PURE__ */ jsx("p", { id: descriptionId, className: cn("text-glob-text-secondary", textSize[size]), children: description }),
+      hasError && /* @__PURE__ */ jsx("p", { id: errorId, className: cn("text-glob-danger", textSize[size]), children: error })
+    ] }));
+  }
+);
+Field.displayName = "Field";
+export {
+  Field
+};
+//# sourceMappingURL=index.mjs.map

package/dist/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/field.tsx"],"sourcesContent":["import { Children, cloneElement, forwardRef, isValidElement, useId } from \"react\"\nimport { cn } from \"@glob-ui/utils\"\nimport { Label } from \"@glob-ui/label\"\n\ntype Size = \"sm\" | \"md\" | \"lg\"\n\nconst textSize: Record<Size, string> = {\n  sm: \"text-xs\",\n  md: \"text-sm\",\n  lg: \"text-base\",\n}\n\ninterface ControlProps {\n  id?: string\n  \"aria-describedby\"?: string\n  \"aria-labelledby\"?: string\n  \"aria-invalid\"?: React.AriaAttributes[\"aria-invalid\"]\n}\n\nexport interface FieldProps extends Omit<React.HTMLAttributes<HTMLDivElement>, \"children\"> {\n  label?: React.ReactNode\n  description?: React.ReactNode\n  /** When truthy, marks the control invalid. The description stays visible. */\n  error?: React.ReactNode\n  /** Shows the asterisk only. Put `required` on the control too, for validation and screen readers. */\n  required?: boolean\n  size?: Size\n  /** One form control. Field injects id, aria-describedby, aria-labelledby and aria-invalid into it. */\n  children: React.ReactElement\n}\n\nconst Field = forwardRef<HTMLDivElement, FieldProps>(\n  ({ label, description, error, required, size = \"md\", className, children, ...props }, ref) => {\n    const baseId = useId()\n    const child = Children.only(children)\n    const childProps: ControlProps = isValidElement<ControlProps>(child) ? child.props : {}\n\n    const controlId = childProps.id ?? `${baseId}-control`\n    const labelId = `${baseId}-label`\n    const descriptionId = `${baseId}-description`\n    const errorId = `${baseId}-error`\n    const hasError = Boolean(error)\n\n    const describedBy =\n      [childProps[\"aria-describedby\"], description ? descriptionId : null, hasError ? errorId : null]\n        .filter(Boolean)\n        .join(\" \") || undefined\n\n    const labelledBy =\n      [childProps[\"aria-labelledby\"], label ? labelId : null].filter(Boolean).join(\" \") || undefined\n\n    const control = isValidElement<ControlProps>(child)\n      ? cloneElement(child, {\n          id: controlId,\n          \"aria-describedby\": describedBy,\n          \"aria-labelledby\": labelledBy,\n          \"aria-invalid\": hasError ? true : childProps[\"aria-invalid\"],\n        })\n      : child\n\n    return (\n      <div ref={ref} className={cn(\"flex flex-col gap-1.5\", className)} {...props}>\n        {label && (\n          <Label id={labelId} htmlFor={controlId} size={size} required={required}>\n            {label}\n          </Label>\n        )}\n        {control}\n        {description && (\n          <p id={descriptionId} className={cn(\"text-glob-text-secondary\", textSize[size])}>\n            {description}\n          </p>\n        )}\n        {hasError && (\n          <p id={errorId} className={cn(\"text-glob-danger\", textSize[size])}>\n            {error}\n          </p>\n        )}\n      </div>\n    )\n  }\n)\nField.displayName = \"Field\"\n\nexport { Field }\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,SAAS,UAAU,cAAc,YAAY,gBAAgB,aAAa;AAC1E,SAAS,UAAU;AACnB,SAAS,aAAa;AA2DhB,SAEI,KAFJ;AAvDN,IAAM,WAAiC;AAAA,EACrC,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN;AAqBA,IAAM,QAAQ;AAAA,EACZ,CAAC,IAAqF,QAAQ;AAA7F,iBAAE,SAAO,aAAa,OAAO,UAAU,OAAO,MAAM,WAAW,SAhClE,IAgCG,IAA4E,kBAA5E,IAA4E,CAA1E,SAAO,eAAa,SAAO,YAAU,QAAa,aAAW;AAhClE,QAAAA;AAiCI,UAAM,SAAS,MAAM;AACrB,UAAM,QAAQ,SAAS,KAAK,QAAQ;AACpC,UAAM,aAA2B,eAA6B,KAAK,IAAI,MAAM,QAAQ,CAAC;AAEtF,UAAM,aAAYA,MAAA,WAAW,OAAX,OAAAA,MAAiB,GAAG,MAAM;AAC5C,UAAM,UAAU,GAAG,MAAM;AACzB,UAAM,gBAAgB,GAAG,MAAM;AAC/B,UAAM,UAAU,GAAG,MAAM;AACzB,UAAM,WAAW,QAAQ,KAAK;AAE9B,UAAM,cACJ,CAAC,WAAW,kBAAkB,GAAG,cAAc,gBAAgB,MAAM,WAAW,UAAU,IAAI,EAC3F,OAAO,OAAO,EACd,KAAK,GAAG,KAAK;AAElB,UAAM,aACJ,CAAC,WAAW,iBAAiB,GAAG,QAAQ,UAAU,IAAI,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG,KAAK;AAEvF,UAAM,UAAU,eAA6B,KAAK,IAC9C,aAAa,OAAO;AAAA,MAClB,IAAI;AAAA,MACJ,oBAAoB;AAAA,MACpB,mBAAmB;AAAA,MACnB,gBAAgB,WAAW,OAAO,WAAW,cAAc;AAAA,IAC7D,CAAC,IACD;AAEJ,WACE,qBAAC,sCAAI,KAAU,WAAW,GAAG,yBAAyB,SAAS,KAAO,QAArE,EACE;AAAA,eACC,oBAAC,SAAM,IAAI,SAAS,SAAS,WAAW,MAAY,UACjD,iBACH;AAAA,MAED;AAAA,MACA,eACC,oBAAC,OAAE,IAAI,eAAe,WAAW,GAAG,4BAA4B,SAAS,IAAI,CAAC,GAC3E,uBACH;AAAA,MAED,YACC,oBAAC,OAAE,IAAI,SAAS,WAAW,GAAG,oBAAoB,SAAS,IAAI,CAAC,GAC7D,iBACH;AAAA,QAEJ;AAAA,EAEJ;AACF;AACA,MAAM,cAAc;","names":["_a"]}

package/package.json

@@ -1,6 +1,68 @@
 {
   "name": "@glob-ui/field",
-  "version": "0.0.0-stage",
-  "stub": true,
-  "description": "Temporary package placeholder for staged publishing"
+  "version": "0.2.0",
+  "main": "./dist/index.js",
+  "module": "./dist/index.mjs",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "import": {
+        "types": "./dist/index.d.mts",
+        "default": "./dist/index.mjs"
+      },
+      "require": {
+        "types": "./dist/index.d.ts",
+        "default": "./dist/index.js"
+      }
+    },
+    "./package.json": "./package.json"
+  },
+  "files": [
+    "dist/",
+    "LICENSE",
+    "README.md"
+  ],
+  "peerDependencies": {
+    "react": "^19"
+  },
+  "dependencies": {
+    "@glob-ui/label": "0.2.0",
+    "@glob-ui/utils": "0.2.0"
+  },
+  "devDependencies": {
+    "tsup": "^8.5.1"
+  },
+  "description": "Wraps one form control with a label, a description and an error, and wires their ARIA attributes to it.",
+  "keywords": [
+    "react",
+    "glob-ui",
+    "components",
+    "accessible",
+    "tailwind",
+    "field"
+  ],
+  "license": "MIT",
+  "author": "Kevin Martínez E",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/kevin-martineze/GlobUI.git",
+    "directory": "packages/field"
+  },
+  "homepage": "https://github.com/kevin-martineze/GlobUI#readme",
+  "bugs": {
+    "url": "https://github.com/kevin-martineze/GlobUI/issues"
+  },
+  "publishConfig": {
+    "access": "public",
+    "provenance": true
+  },
+  "sideEffects": false,
+  "type": "commonjs",
+  "engines": {
+    "node": ">=18.18"
+  },
+  "scripts": {
+    "build": "tsup",
+    "dev": "tsup --watch --no-clean"
+  }
 }