@glob-ui/alert 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/alert
 
-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.
+A callout for information, success, warning or an error, with an icon.
+
+## Install
+
+```bash
+pnpm add @glob-ui/alert
+```
+
+## Documentation
+
+Full docs, examples and the accessibility table: [Alert](https://github.com/kevin-martineze/GlobUI/tree/main/apps/docs/content/docs/components/alert.mdx).
+
+## License
+
+MIT. See [LICENSE](./LICENSE).

package/dist/index.d.mts

@@ -0,0 +1,29 @@
+import * as react from 'react';
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as class_variance_authority_types from 'class-variance-authority/types';
+import { VariantProps } from 'class-variance-authority';
+
+type AlertVariant = "default" | "info" | "success" | "warning" | "danger";
+declare const alertVariants: (props?: ({
+    variant?: "default" | "info" | "success" | "warning" | "danger" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+interface AlertIconProps {
+    variant?: AlertVariant;
+    className?: string;
+}
+/** The variant's icon, coloured. Decorative: hidden from assistive tech. */
+declare function AlertIcon({ variant, className }: AlertIconProps): react_jsx_runtime.JSX.Element;
+declare namespace AlertIcon {
+    var displayName: string;
+}
+interface AlertProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof alertVariants> {
+    /** Replaces the variant's default icon. Pass `null` to hide it. */
+    icon?: React.ReactNode;
+}
+declare const Alert: react.ForwardRefExoticComponent<AlertProps & react.RefAttributes<HTMLDivElement>>;
+type AlertTitleProps = React.HTMLAttributes<HTMLDivElement>;
+declare const AlertTitle: react.ForwardRefExoticComponent<AlertTitleProps & react.RefAttributes<HTMLDivElement>>;
+type AlertDescriptionProps = React.HTMLAttributes<HTMLDivElement>;
+declare const AlertDescription: react.ForwardRefExoticComponent<AlertDescriptionProps & react.RefAttributes<HTMLDivElement>>;
+
+export { Alert, AlertDescription, type AlertDescriptionProps, AlertIcon, type AlertIconProps, type AlertProps, AlertTitle, type AlertTitleProps, type AlertVariant, alertVariants };

package/dist/index.d.ts

@@ -0,0 +1,29 @@
+import * as react from 'react';
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as class_variance_authority_types from 'class-variance-authority/types';
+import { VariantProps } from 'class-variance-authority';
+
+type AlertVariant = "default" | "info" | "success" | "warning" | "danger";
+declare const alertVariants: (props?: ({
+    variant?: "default" | "info" | "success" | "warning" | "danger" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+interface AlertIconProps {
+    variant?: AlertVariant;
+    className?: string;
+}
+/** The variant's icon, coloured. Decorative: hidden from assistive tech. */
+declare function AlertIcon({ variant, className }: AlertIconProps): react_jsx_runtime.JSX.Element;
+declare namespace AlertIcon {
+    var displayName: string;
+}
+interface AlertProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof alertVariants> {
+    /** Replaces the variant's default icon. Pass `null` to hide it. */
+    icon?: React.ReactNode;
+}
+declare const Alert: react.ForwardRefExoticComponent<AlertProps & react.RefAttributes<HTMLDivElement>>;
+type AlertTitleProps = React.HTMLAttributes<HTMLDivElement>;
+declare const AlertTitle: react.ForwardRefExoticComponent<AlertTitleProps & react.RefAttributes<HTMLDivElement>>;
+type AlertDescriptionProps = React.HTMLAttributes<HTMLDivElement>;
+declare const AlertDescription: react.ForwardRefExoticComponent<AlertDescriptionProps & react.RefAttributes<HTMLDivElement>>;
+
+export { Alert, AlertDescription, type AlertDescriptionProps, AlertIcon, type AlertIconProps, type AlertProps, AlertTitle, type AlertTitleProps, type AlertVariant, alertVariants };

package/dist/index.js

@@ -0,0 +1,154 @@
+"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, {
+  Alert: () => Alert,
+  AlertDescription: () => AlertDescription,
+  AlertIcon: () => AlertIcon,
+  AlertTitle: () => AlertTitle,
+  alertVariants: () => alertVariants
+});
+module.exports = __toCommonJS(index_exports);
+
+// src/alert.tsx
+var import_react = require("react");
+var import_class_variance_authority = require("class-variance-authority");
+var import_utils = require("@glob-ui/utils");
+var import_jsx_runtime = require("react/jsx-runtime");
+var alertVariants = (0, import_class_variance_authority.cva)("relative flex w-full gap-3 rounded-glob-lg border p-4 text-sm text-glob-text", {
+  variants: {
+    variant: {
+      default: "border-glob-border bg-glob-surface",
+      info: "border-glob-info/30 bg-glob-info-light",
+      success: "border-glob-success/30 bg-glob-success-light",
+      warning: "border-glob-warning/30 bg-glob-warning-light",
+      danger: "border-glob-danger/30 bg-glob-danger-light"
+    }
+  },
+  defaultVariants: {
+    variant: "default"
+  }
+});
+var iconColor = {
+  default: "text-glob-text-secondary",
+  info: "text-glob-info",
+  success: "text-glob-success",
+  warning: "text-glob-warning",
+  danger: "text-glob-danger"
+};
+var iconPaths = {
+  default: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("circle", { cx: "12", cy: "12", r: "10" }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M12 16v-4M12 8h.01" })
+  ] }),
+  info: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("circle", { cx: "12", cy: "12", r: "10" }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M12 16v-4M12 8h.01" })
+  ] }),
+  success: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("circle", { cx: "12", cy: "12", r: "10" }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M8 12l3 3 5-6" })
+  ] }),
+  warning: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M10.3 3.9L1.8 18a2 2 0 0 0 1.7 3h17a2 2 0 0 0 1.7-3L13.7 3.9a2 2 0 0 0-3.4 0z" }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M12 9v4M12 17h.01" })
+  ] }),
+  danger: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("circle", { cx: "12", cy: "12", r: "10" }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M15 9l-6 6M9 9l6 6" })
+  ] })
+};
+function AlertIcon({ variant = "default", className }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { "aria-hidden": "true", className: (0, import_utils.cn)("mt-0.5 flex shrink-0", iconColor[variant], className), children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    "svg",
+    {
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      className: "h-4 w-4",
+      children: iconPaths[variant]
+    }
+  ) });
+}
+AlertIcon.displayName = "AlertIcon";
+var Alert = (0, import_react.forwardRef)(
+  (_a, ref) => {
+    var _b = _a, { className, variant, icon, children } = _b, props = __objRest(_b, ["className", "variant", "icon", "children"]);
+    const v = variant != null ? variant : "default";
+    const role = v === "warning" || v === "danger" ? "alert" : "status";
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", __spreadProps(__spreadValues({ ref, role, className: (0, import_utils.cn)(alertVariants({ variant, className })) }, props), { children: [
+      icon === void 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(AlertIcon, { variant: v }) : icon !== null && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { "aria-hidden": "true", className: (0, import_utils.cn)("mt-0.5 flex shrink-0", iconColor[v]), children: icon }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "flex min-w-0 flex-1 flex-col gap-1", children })
+    ] }));
+  }
+);
+Alert.displayName = "Alert";
+var AlertTitle = (0, import_react.forwardRef)((_a, ref) => {
+  var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", __spreadValues({ ref, className: (0, import_utils.cn)("font-medium leading-5", className) }, props));
+});
+AlertTitle.displayName = "AlertTitle";
+var AlertDescription = (0, import_react.forwardRef)((_a, ref) => {
+  var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", __spreadValues({ ref, className: (0, import_utils.cn)("leading-5 text-glob-text-secondary", className) }, props));
+});
+AlertDescription.displayName = "AlertDescription";
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Alert,
+  AlertDescription,
+  AlertIcon,
+  AlertTitle,
+  alertVariants
+});
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/index.ts","../src/alert.tsx"],"sourcesContent":["export { Alert, AlertTitle, AlertDescription, AlertIcon, alertVariants } from \"./alert\"\nexport type { AlertProps, AlertTitleProps, AlertDescriptionProps, AlertIconProps, AlertVariant } from \"./alert\"\n","import { forwardRef } from \"react\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\nimport { cn } from \"@glob-ui/utils\"\n\nexport type AlertVariant = \"default\" | \"info\" | \"success\" | \"warning\" | \"danger\"\n\nconst alertVariants = cva(\"relative flex w-full gap-3 rounded-glob-lg border p-4 text-sm text-glob-text\", {\n  variants: {\n    variant: {\n      default: \"border-glob-border bg-glob-surface\",\n      info: \"border-glob-info/30 bg-glob-info-light\",\n      success: \"border-glob-success/30 bg-glob-success-light\",\n      warning: \"border-glob-warning/30 bg-glob-warning-light\",\n      danger: \"border-glob-danger/30 bg-glob-danger-light\",\n    },\n  },\n  defaultVariants: {\n    variant: \"default\",\n  },\n})\n\nconst iconColor: Record<AlertVariant, string> = {\n  default: \"text-glob-text-secondary\",\n  info: \"text-glob-info\",\n  success: \"text-glob-success\",\n  warning: \"text-glob-warning\",\n  danger: \"text-glob-danger\",\n}\n\nconst iconPaths: Record<AlertVariant, React.ReactNode> = {\n  default: (\n    <>\n      <circle cx=\"12\" cy=\"12\" r=\"10\" />\n      <path d=\"M12 16v-4M12 8h.01\" />\n    </>\n  ),\n  info: (\n    <>\n      <circle cx=\"12\" cy=\"12\" r=\"10\" />\n      <path d=\"M12 16v-4M12 8h.01\" />\n    </>\n  ),\n  success: (\n    <>\n      <circle cx=\"12\" cy=\"12\" r=\"10\" />\n      <path d=\"M8 12l3 3 5-6\" />\n    </>\n  ),\n  warning: (\n    <>\n      <path d=\"M10.3 3.9L1.8 18a2 2 0 0 0 1.7 3h17a2 2 0 0 0 1.7-3L13.7 3.9a2 2 0 0 0-3.4 0z\" />\n      <path d=\"M12 9v4M12 17h.01\" />\n    </>\n  ),\n  danger: (\n    <>\n      <circle cx=\"12\" cy=\"12\" r=\"10\" />\n      <path d=\"M15 9l-6 6M9 9l6 6\" />\n    </>\n  ),\n}\n\nexport interface AlertIconProps {\n  variant?: AlertVariant\n  className?: string\n}\n\n/** The variant's icon, coloured. Decorative: hidden from assistive tech. */\nfunction AlertIcon({ variant = \"default\", className }: AlertIconProps) {\n  return (\n    <span aria-hidden=\"true\" className={cn(\"mt-0.5 flex shrink-0\", iconColor[variant], className)}>\n      <svg\n        viewBox=\"0 0 24 24\"\n        fill=\"none\"\n        stroke=\"currentColor\"\n        strokeWidth=\"2\"\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n        className=\"h-4 w-4\"\n      >\n        {iconPaths[variant]}\n      </svg>\n    </span>\n  )\n}\nAlertIcon.displayName = \"AlertIcon\"\n\nexport interface AlertProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    VariantProps<typeof alertVariants> {\n  /** Replaces the variant's default icon. Pass `null` to hide it. */\n  icon?: React.ReactNode\n}\n\nconst Alert = forwardRef<HTMLDivElement, AlertProps>(\n  ({ className, variant, icon, children, ...props }, ref) => {\n    const v = variant ?? \"default\"\n    // Only urgent variants interrupt screen readers; the rest are polite.\n    const role = v === \"warning\" || v === \"danger\" ? \"alert\" : \"status\"\n\n    return (\n      <div ref={ref} role={role} className={cn(alertVariants({ variant, className }))} {...props}>\n        {icon === undefined ? (\n          <AlertIcon variant={v} />\n        ) : (\n          icon !== null && (\n            <span aria-hidden=\"true\" className={cn(\"mt-0.5 flex shrink-0\", iconColor[v])}>\n              {icon}\n            </span>\n          )\n        )}\n        <div className=\"flex min-w-0 flex-1 flex-col gap-1\">{children}</div>\n      </div>\n    )\n  }\n)\nAlert.displayName = \"Alert\"\n\nexport type AlertTitleProps = React.HTMLAttributes<HTMLDivElement>\n\nconst AlertTitle = forwardRef<HTMLDivElement, AlertTitleProps>(({ className, ...props }, ref) => (\n  <div ref={ref} className={cn(\"font-medium leading-5\", className)} {...props} />\n))\nAlertTitle.displayName = \"AlertTitle\"\n\nexport type AlertDescriptionProps = React.HTMLAttributes<HTMLDivElement>\n\nconst AlertDescription = forwardRef<HTMLDivElement, AlertDescriptionProps>(({ className, ...props }, ref) => (\n  <div ref={ref} className={cn(\"leading-5 text-glob-text-secondary\", className)} {...props} />\n))\nAlertDescription.displayName = \"AlertDescription\"\n\nexport { Alert, AlertTitle, AlertDescription, AlertIcon, alertVariants }\n"],"mappings":"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","names":[]}

package/dist/index.mjs

@@ -0,0 +1,126 @@
+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/alert.tsx
+import { forwardRef } from "react";
+import { cva } from "class-variance-authority";
+import { cn } from "@glob-ui/utils";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+var alertVariants = cva("relative flex w-full gap-3 rounded-glob-lg border p-4 text-sm text-glob-text", {
+  variants: {
+    variant: {
+      default: "border-glob-border bg-glob-surface",
+      info: "border-glob-info/30 bg-glob-info-light",
+      success: "border-glob-success/30 bg-glob-success-light",
+      warning: "border-glob-warning/30 bg-glob-warning-light",
+      danger: "border-glob-danger/30 bg-glob-danger-light"
+    }
+  },
+  defaultVariants: {
+    variant: "default"
+  }
+});
+var iconColor = {
+  default: "text-glob-text-secondary",
+  info: "text-glob-info",
+  success: "text-glob-success",
+  warning: "text-glob-warning",
+  danger: "text-glob-danger"
+};
+var iconPaths = {
+  default: /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "10" }),
+    /* @__PURE__ */ jsx("path", { d: "M12 16v-4M12 8h.01" })
+  ] }),
+  info: /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "10" }),
+    /* @__PURE__ */ jsx("path", { d: "M12 16v-4M12 8h.01" })
+  ] }),
+  success: /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "10" }),
+    /* @__PURE__ */ jsx("path", { d: "M8 12l3 3 5-6" })
+  ] }),
+  warning: /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx("path", { d: "M10.3 3.9L1.8 18a2 2 0 0 0 1.7 3h17a2 2 0 0 0 1.7-3L13.7 3.9a2 2 0 0 0-3.4 0z" }),
+    /* @__PURE__ */ jsx("path", { d: "M12 9v4M12 17h.01" })
+  ] }),
+  danger: /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "10" }),
+    /* @__PURE__ */ jsx("path", { d: "M15 9l-6 6M9 9l6 6" })
+  ] })
+};
+function AlertIcon({ variant = "default", className }) {
+  return /* @__PURE__ */ jsx("span", { "aria-hidden": "true", className: cn("mt-0.5 flex shrink-0", iconColor[variant], className), children: /* @__PURE__ */ jsx(
+    "svg",
+    {
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      className: "h-4 w-4",
+      children: iconPaths[variant]
+    }
+  ) });
+}
+AlertIcon.displayName = "AlertIcon";
+var Alert = forwardRef(
+  (_a, ref) => {
+    var _b = _a, { className, variant, icon, children } = _b, props = __objRest(_b, ["className", "variant", "icon", "children"]);
+    const v = variant != null ? variant : "default";
+    const role = v === "warning" || v === "danger" ? "alert" : "status";
+    return /* @__PURE__ */ jsxs("div", __spreadProps(__spreadValues({ ref, role, className: cn(alertVariants({ variant, className })) }, props), { children: [
+      icon === void 0 ? /* @__PURE__ */ jsx(AlertIcon, { variant: v }) : icon !== null && /* @__PURE__ */ jsx("span", { "aria-hidden": "true", className: cn("mt-0.5 flex shrink-0", iconColor[v]), children: icon }),
+      /* @__PURE__ */ jsx("div", { className: "flex min-w-0 flex-1 flex-col gap-1", children })
+    ] }));
+  }
+);
+Alert.displayName = "Alert";
+var AlertTitle = forwardRef((_a, ref) => {
+  var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
+  return /* @__PURE__ */ jsx("div", __spreadValues({ ref, className: cn("font-medium leading-5", className) }, props));
+});
+AlertTitle.displayName = "AlertTitle";
+var AlertDescription = forwardRef((_a, ref) => {
+  var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
+  return /* @__PURE__ */ jsx("div", __spreadValues({ ref, className: cn("leading-5 text-glob-text-secondary", className) }, props));
+});
+AlertDescription.displayName = "AlertDescription";
+export {
+  Alert,
+  AlertDescription,
+  AlertIcon,
+  AlertTitle,
+  alertVariants
+};
+//# sourceMappingURL=index.mjs.map

package/dist/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/alert.tsx"],"sourcesContent":["import { forwardRef } from \"react\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\nimport { cn } from \"@glob-ui/utils\"\n\nexport type AlertVariant = \"default\" | \"info\" | \"success\" | \"warning\" | \"danger\"\n\nconst alertVariants = cva(\"relative flex w-full gap-3 rounded-glob-lg border p-4 text-sm text-glob-text\", {\n  variants: {\n    variant: {\n      default: \"border-glob-border bg-glob-surface\",\n      info: \"border-glob-info/30 bg-glob-info-light\",\n      success: \"border-glob-success/30 bg-glob-success-light\",\n      warning: \"border-glob-warning/30 bg-glob-warning-light\",\n      danger: \"border-glob-danger/30 bg-glob-danger-light\",\n    },\n  },\n  defaultVariants: {\n    variant: \"default\",\n  },\n})\n\nconst iconColor: Record<AlertVariant, string> = {\n  default: \"text-glob-text-secondary\",\n  info: \"text-glob-info\",\n  success: \"text-glob-success\",\n  warning: \"text-glob-warning\",\n  danger: \"text-glob-danger\",\n}\n\nconst iconPaths: Record<AlertVariant, React.ReactNode> = {\n  default: (\n    <>\n      <circle cx=\"12\" cy=\"12\" r=\"10\" />\n      <path d=\"M12 16v-4M12 8h.01\" />\n    </>\n  ),\n  info: (\n    <>\n      <circle cx=\"12\" cy=\"12\" r=\"10\" />\n      <path d=\"M12 16v-4M12 8h.01\" />\n    </>\n  ),\n  success: (\n    <>\n      <circle cx=\"12\" cy=\"12\" r=\"10\" />\n      <path d=\"M8 12l3 3 5-6\" />\n    </>\n  ),\n  warning: (\n    <>\n      <path d=\"M10.3 3.9L1.8 18a2 2 0 0 0 1.7 3h17a2 2 0 0 0 1.7-3L13.7 3.9a2 2 0 0 0-3.4 0z\" />\n      <path d=\"M12 9v4M12 17h.01\" />\n    </>\n  ),\n  danger: (\n    <>\n      <circle cx=\"12\" cy=\"12\" r=\"10\" />\n      <path d=\"M15 9l-6 6M9 9l6 6\" />\n    </>\n  ),\n}\n\nexport interface AlertIconProps {\n  variant?: AlertVariant\n  className?: string\n}\n\n/** The variant's icon, coloured. Decorative: hidden from assistive tech. */\nfunction AlertIcon({ variant = \"default\", className }: AlertIconProps) {\n  return (\n    <span aria-hidden=\"true\" className={cn(\"mt-0.5 flex shrink-0\", iconColor[variant], className)}>\n      <svg\n        viewBox=\"0 0 24 24\"\n        fill=\"none\"\n        stroke=\"currentColor\"\n        strokeWidth=\"2\"\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n        className=\"h-4 w-4\"\n      >\n        {iconPaths[variant]}\n      </svg>\n    </span>\n  )\n}\nAlertIcon.displayName = \"AlertIcon\"\n\nexport interface AlertProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    VariantProps<typeof alertVariants> {\n  /** Replaces the variant's default icon. Pass `null` to hide it. */\n  icon?: React.ReactNode\n}\n\nconst Alert = forwardRef<HTMLDivElement, AlertProps>(\n  ({ className, variant, icon, children, ...props }, ref) => {\n    const v = variant ?? \"default\"\n    // Only urgent variants interrupt screen readers; the rest are polite.\n    const role = v === \"warning\" || v === \"danger\" ? \"alert\" : \"status\"\n\n    return (\n      <div ref={ref} role={role} className={cn(alertVariants({ variant, className }))} {...props}>\n        {icon === undefined ? (\n          <AlertIcon variant={v} />\n        ) : (\n          icon !== null && (\n            <span aria-hidden=\"true\" className={cn(\"mt-0.5 flex shrink-0\", iconColor[v])}>\n              {icon}\n            </span>\n          )\n        )}\n        <div className=\"flex min-w-0 flex-1 flex-col gap-1\">{children}</div>\n      </div>\n    )\n  }\n)\nAlert.displayName = \"Alert\"\n\nexport type AlertTitleProps = React.HTMLAttributes<HTMLDivElement>\n\nconst AlertTitle = forwardRef<HTMLDivElement, AlertTitleProps>(({ className, ...props }, ref) => (\n  <div ref={ref} className={cn(\"font-medium leading-5\", className)} {...props} />\n))\nAlertTitle.displayName = \"AlertTitle\"\n\nexport type AlertDescriptionProps = React.HTMLAttributes<HTMLDivElement>\n\nconst AlertDescription = forwardRef<HTMLDivElement, AlertDescriptionProps>(({ className, ...props }, ref) => (\n  <div ref={ref} className={cn(\"leading-5 text-glob-text-secondary\", className)} {...props} />\n))\nAlertDescription.displayName = \"AlertDescription\"\n\nexport { Alert, AlertTitle, AlertDescription, AlertIcon, alertVariants }\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,SAAS,kBAAkB;AAC3B,SAAS,WAA8B;AACvC,SAAS,UAAU;AA6Bf,mBACE,KADF;AAzBJ,IAAM,gBAAgB,IAAI,gFAAgF;AAAA,EACxG,UAAU;AAAA,IACR,SAAS;AAAA,MACP,SAAS;AAAA,MACT,MAAM;AAAA,MACN,SAAS;AAAA,MACT,SAAS;AAAA,MACT,QAAQ;AAAA,IACV;AAAA,EACF;AAAA,EACA,iBAAiB;AAAA,IACf,SAAS;AAAA,EACX;AACF,CAAC;AAED,IAAM,YAA0C;AAAA,EAC9C,SAAS;AAAA,EACT,MAAM;AAAA,EACN,SAAS;AAAA,EACT,SAAS;AAAA,EACT,QAAQ;AACV;AAEA,IAAM,YAAmD;AAAA,EACvD,SACE,iCACE;AAAA,wBAAC,YAAO,IAAG,MAAK,IAAG,MAAK,GAAE,MAAK;AAAA,IAC/B,oBAAC,UAAK,GAAE,sBAAqB;AAAA,KAC/B;AAAA,EAEF,MACE,iCACE;AAAA,wBAAC,YAAO,IAAG,MAAK,IAAG,MAAK,GAAE,MAAK;AAAA,IAC/B,oBAAC,UAAK,GAAE,sBAAqB;AAAA,KAC/B;AAAA,EAEF,SACE,iCACE;AAAA,wBAAC,YAAO,IAAG,MAAK,IAAG,MAAK,GAAE,MAAK;AAAA,IAC/B,oBAAC,UAAK,GAAE,iBAAgB;AAAA,KAC1B;AAAA,EAEF,SACE,iCACE;AAAA,wBAAC,UAAK,GAAE,iFAAgF;AAAA,IACxF,oBAAC,UAAK,GAAE,qBAAoB;AAAA,KAC9B;AAAA,EAEF,QACE,iCACE;AAAA,wBAAC,YAAO,IAAG,MAAK,IAAG,MAAK,GAAE,MAAK;AAAA,IAC/B,oBAAC,UAAK,GAAE,sBAAqB;AAAA,KAC/B;AAEJ;AAQA,SAAS,UAAU,EAAE,UAAU,WAAW,UAAU,GAAmB;AACrE,SACE,oBAAC,UAAK,eAAY,QAAO,WAAW,GAAG,wBAAwB,UAAU,OAAO,GAAG,SAAS,GAC1F;AAAA,IAAC;AAAA;AAAA,MACC,SAAQ;AAAA,MACR,MAAK;AAAA,MACL,QAAO;AAAA,MACP,aAAY;AAAA,MACZ,eAAc;AAAA,MACd,gBAAe;AAAA,MACf,WAAU;AAAA,MAET,oBAAU,OAAO;AAAA;AAAA,EACpB,GACF;AAEJ;AACA,UAAU,cAAc;AASxB,IAAM,QAAQ;AAAA,EACZ,CAAC,IAAkD,QAAQ;AAA1D,iBAAE,aAAW,SAAS,MAAM,SA/F/B,IA+FG,IAAyC,kBAAzC,IAAyC,CAAvC,aAAW,WAAS,QAAM;AAC3B,UAAM,IAAI,4BAAW;AAErB,UAAM,OAAO,MAAM,aAAa,MAAM,WAAW,UAAU;AAE3D,WACE,qBAAC,sCAAI,KAAU,MAAY,WAAW,GAAG,cAAc,EAAE,SAAS,UAAU,CAAC,CAAC,KAAO,QAApF,EACE;AAAA,eAAS,SACR,oBAAC,aAAU,SAAS,GAAG,IAEvB,SAAS,QACP,oBAAC,UAAK,eAAY,QAAO,WAAW,GAAG,wBAAwB,UAAU,CAAC,CAAC,GACxE,gBACH;AAAA,MAGJ,oBAAC,SAAI,WAAU,sCAAsC,UAAS;AAAA,QAChE;AAAA,EAEJ;AACF;AACA,MAAM,cAAc;AAIpB,IAAM,aAAa,WAA4C,CAAC,IAAyB,QAAK;AAA9B,eAAE,YAxHlE,IAwHgE,IAAgB,kBAAhB,IAAgB,CAAd;AAChE,6BAAC,wBAAI,KAAU,WAAW,GAAG,yBAAyB,SAAS,KAAO,MAAO;AAAA,CAC9E;AACD,WAAW,cAAc;AAIzB,IAAM,mBAAmB,WAAkD,CAAC,IAAyB,QAAK;AAA9B,eAAE,YA/H9E,IA+H4E,IAAgB,kBAAhB,IAAgB,CAAd;AAC5E,6BAAC,wBAAI,KAAU,WAAW,GAAG,sCAAsC,SAAS,KAAO,MAAO;AAAA,CAC3F;AACD,iBAAiB,cAAc;","names":[]}

package/package.json

@@ -1,6 +1,68 @@
 {
   "name": "@glob-ui/alert",
-  "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/utils": "0.2.0",
+    "class-variance-authority": "^0.7.1"
+  },
+  "devDependencies": {
+    "tsup": "^8.5.1"
+  },
+  "description": "A callout for information, success, warning or an error, with an icon.",
+  "keywords": [
+    "react",
+    "glob-ui",
+    "components",
+    "accessible",
+    "tailwind",
+    "alert"
+  ],
+  "license": "MIT",
+  "author": "Kevin Martínez E",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/kevin-martineze/GlobUI.git",
+    "directory": "packages/alert"
+  },
+  "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"
+  }
 }