@popgrids/ui 0.0.36 → 0.0.37

package/dist/index.cjs

@@ -1466,6 +1466,87 @@ function InputGroupTextarea({ className, ...props }) {
     }
   );
 }
+var inputStatusVariants = classVarianceAuthority.cva(
+  "inline-flex h-10 min-w-[54px] cursor-pointer items-stretch rounded-sm border-0 bg-transparent p-0 outline-none transition-colors focus-visible:ring-[3px] focus-visible:ring-ring/60 disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0",
+  {
+    variants: {
+      theme: {
+        approve: "text-success-700 dark:text-success-200",
+        publish: "text-success-700 dark:text-success-200",
+        feedback: "text-success-700 dark:text-success-200",
+        flagged: "text-warning-700 dark:text-warning-200",
+        review: "text-warning-700 dark:text-warning-200",
+        delete: "text-error-600 dark:text-error-300",
+        blocked: "text-error-600 dark:text-error-300",
+        reject: "text-error-600 dark:text-error-300"
+      },
+      variant: {
+        community: "",
+        content: ""
+      }
+    },
+    defaultVariants: {
+      theme: "approve",
+      variant: "community"
+    }
+  }
+);
+var inputStatusInnerVariants = classVarianceAuthority.cva(
+  "flex flex-1 items-center gap-0.5 overflow-hidden rounded-sm py-2.5 pr-1.5 pl-[10px]",
+  {
+    variants: {
+      theme: {
+        approve: "bg-success-100 dark:bg-success-200/16",
+        publish: "bg-success-100 dark:bg-success-200/16",
+        feedback: "bg-success-100 dark:bg-success-200/16",
+        flagged: "bg-warning-100 dark:bg-warning-200/16",
+        review: "bg-warning-100 dark:bg-warning-200/16",
+        delete: "bg-error-100 dark:bg-error-300/16",
+        blocked: "bg-error-100 dark:bg-error-300/16",
+        reject: "bg-error-100 dark:bg-error-300/16"
+      }
+    },
+    defaultVariants: {
+      theme: "approve"
+    }
+  }
+);
+var STATUS_ICON = {
+  flagged: icons.Hourglass03,
+  review: icons.Hourglass03,
+  approve: icons.ThumbsUp,
+  publish: icons.CheckCircle,
+  feedback: icons.MessageAlertSquare,
+  delete: icons.ThumbsDown,
+  blocked: icons.SlashCircle01,
+  reject: icons.ThumbsDown
+};
+function InputStatus({
+  className,
+  theme = "approve",
+  variant = "community",
+  open = false,
+  "aria-expanded": ariaExpanded,
+  type = "button",
+  ...props
+}) {
+  const Icon = STATUS_ICON[theme];
+  const expanded = ariaExpanded !== void 0 ? ariaExpanded : open;
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    button.Button,
+    {
+      "data-slot": "input-status",
+      type,
+      "aria-expanded": expanded,
+      className: cn(inputStatusVariants({ theme, variant }), className),
+      ...props,
+      children: /* @__PURE__ */ jsxRuntime.jsxs("span", { className: inputStatusInnerVariants({ theme }), children: [
+        /* @__PURE__ */ jsxRuntime.jsx(Icon, { className: "size-5", "aria-hidden": true }),
+        open ? /* @__PURE__ */ jsxRuntime.jsx(icons.ChevronUp, { className: "size-4", "aria-hidden": true }) : /* @__PURE__ */ jsxRuntime.jsx(icons.ChevronDown, { className: "size-4", "aria-hidden": true })
+      ] })
+    }
+  );
+}
 function Label({ className, render, ...props }) {
   const defaultProps = {
     "data-slot": "label",
@@ -2090,6 +2171,7 @@ exports.InputGroupButton = InputGroupButton;
 exports.InputGroupInput = InputGroupInput;
 exports.InputGroupText = InputGroupText;
 exports.InputGroupTextarea = InputGroupTextarea;
+exports.InputStatus = InputStatus;
 exports.Label = Label;
 exports.Loader = Loader;
 exports.Logo = Logo;