@tesouro/embedded-components-react 0.2.7 → 0.2.16

package/dist/libs/tesouro-embedded-components-react/team-widget/ui/dist/index6.js

@@ -1,106 +1,100 @@
 "use client";
-import { jsxs as s, jsx as t } from "react/jsx-runtime";
-import { Plus as f, MoreVertical as p, Pencil as g, Trash2 as h } from "lucide-react";
-import { Button as d, Skeleton as n, DropdownMenu as x, DropdownMenuTrigger as b, DropdownMenuContent as N, DropdownMenuItem as o } from "../../../../../packages/shared-ui-shadcn/dist/index.js";
-import { AvatarStack as v } from "./index2.js";
-import { DEFAULT_GROUP_ADMIN_PANEL_LABELS as A } from "./index7.js";
-const y = 4;
-function z({
-  rows: i,
-  icon: w,
-  isLoading: a = !1,
-  isError: c = !1,
-  onAddClick: l,
-  labels: m
+import { jsx as e, jsxs as a } from "react/jsx-runtime";
+import { Sheet as g, SheetContent as v, SheetHeader as x, SheetTitle as y, SheetDescription as C, Label as m, Input as D, Combobox as N, SheetFooter as E, Button as r } from "../../../../../packages/shared-ui-shadcn/dist/index.js";
+import "@radix-ui/react-use-controllable-state";
+import "lucide-react";
+import "react";
+import "../../../shared/ui/dist/lib/UIContext/UIContext.js";
+import { InlineErrorAlert as A } from "../../../shared/ui/dist/lib/InlineErrorAlert/InlineErrorAlert.js";
+import { DEFAULT_GROUP_ADMIN_DRAWER_LABELS as L } from "./index7.js";
+function P({
+  open: c,
+  isEditMode: l,
+  name: d,
+  onNameChange: p,
+  options: h,
+  selectedOptions: u,
+  onSelectedOptionsChange: w,
+  isSaveDisabled: b = !1,
+  submitErrorMessage: s,
+  onOpenChange: i,
+  onSubmit: S,
+  onDelete: o,
+  labels: f
 }) {
-  const r = { ...A, ...m };
-  return /* @__PURE__ */ s(
-    "section",
-    {
-      "aria-label": r.title,
-      "aria-busy": a || void 0,
-      className: "ttw:overflow-hidden ttw:rounded-md ttw:border ttw:border-border ttw:bg-background",
-      children: [
-        /* @__PURE__ */ s("div", { className: "ttw:flex ttw:items-center ttw:justify-between ttw:gap-4 ttw:border-b ttw:border-border ttw:p-3", children: [
-          /* @__PURE__ */ t("h2", { className: "ttw:text-lg ttw:font-semibold ttw:text-foreground", children: r.title }),
-          l && /* @__PURE__ */ s(d, { size: "sm", disabled: a, onClick: l, children: [
-            /* @__PURE__ */ t(f, { "aria-hidden": !0, className: "ttw:size-4" }),
-            r.addButton
-          ] })
-        ] }),
-        /* @__PURE__ */ s(
-          "div",
-          {
-            className: "ttw:grid ttw:grid-cols-[2fr_2fr_80px] ttw:items-center ttw:gap-4 ttw:border-b ttw:border-border ttw:px-4 ttw:py-2.5",
-            role: "row",
-            children: [
-              /* @__PURE__ */ t("span", { className: "ttw:text-sm ttw:font-medium ttw:text-foreground", children: r.nameColumn }),
-              /* @__PURE__ */ t("span", { className: "ttw:text-sm ttw:font-medium ttw:text-foreground", children: r.assignedColumn }),
-              /* @__PURE__ */ t("span", { className: "ttw:text-right ttw:text-sm ttw:font-medium ttw:text-foreground", children: r.actionsColumn })
-            ]
-          }
-        ),
-        c ? /* @__PURE__ */ s("div", { className: "ttw:flex ttw:flex-col ttw:items-center ttw:justify-center ttw:px-4 ttw:py-14 ttw:text-center", children: [
-          /* @__PURE__ */ t("h3", { className: "ttw:mb-2 ttw:text-lg ttw:font-bold ttw:tracking-tight ttw:text-foreground", children: r.errorTitle }),
-          /* @__PURE__ */ t("p", { className: "ttw:max-w-sm ttw:text-sm ttw:text-muted-foreground", children: r.errorDescription })
-        ] }) : a ? /* @__PURE__ */ t("div", { "aria-label": r.loadingLabel, role: "status", children: Array.from({ length: y }).map((e, u) => /* @__PURE__ */ s(
-          "div",
-          {
-            className: "ttw:grid ttw:grid-cols-[2fr_2fr_80px] ttw:items-center ttw:gap-4 ttw:px-4 ttw:py-3",
-            children: [
-              /* @__PURE__ */ t(n, { className: "ttw:h-4 ttw:w-40" }),
-              /* @__PURE__ */ t(n, { className: "ttw:h-4 ttw:w-24" }),
-              /* @__PURE__ */ t("div", { className: "ttw:flex ttw:justify-end", children: /* @__PURE__ */ t(n, { className: "ttw:size-8 ttw:rounded-full" }) })
-            ]
-          },
-          u
-        )) }) : i.length === 0 ? /* @__PURE__ */ t("div", { className: "ttw:px-4 ttw:py-12 ttw:text-center ttw:text-sm ttw:text-muted-foreground", children: r.emptyMessage }) : /* @__PURE__ */ t("div", { className: "ttw:divide-y ttw:divide-border", children: i.map((e) => /* @__PURE__ */ s(
-          "div",
-          {
-            className: "ttw:grid ttw:grid-cols-[2fr_2fr_80px] ttw:items-center ttw:gap-4 ttw:px-4 ttw:py-3",
-            children: [
-              /* @__PURE__ */ s("div", { className: "ttw:flex ttw:items-center ttw:gap-2", children: [
-                /* @__PURE__ */ t("span", { "aria-hidden": !0, className: "ttw:text-muted-foreground", children: w }),
-                /* @__PURE__ */ t("span", { className: "ttw:text-sm ttw:font-medium ttw:text-foreground", children: e.name })
-              ] }),
-              e.assignedAvatars && e.assignedAvatars.length > 0 ? /* @__PURE__ */ t(
-                v,
+  const t = { ...L, ...f };
+  return /* @__PURE__ */ e(g, { open: c, onOpenChange: i, children: /* @__PURE__ */ a(v, { className: "ttw:gap-0", children: [
+    /* @__PURE__ */ a(x, { children: [
+      /* @__PURE__ */ e(y, { children: l ? t.editTitle : t.createTitle }),
+      /* @__PURE__ */ e(C, { children: t.description })
+    ] }),
+    /* @__PURE__ */ a(
+      "form",
+      {
+        noValidate: !0,
+        className: "ttw:flex ttw:flex-1 ttw:flex-col",
+        onSubmit: (n) => {
+          n.preventDefault(), S();
+        },
+        children: [
+          /* @__PURE__ */ a("div", { className: "ttw:flex-1 ttw:space-y-5 ttw:px-4 ttw:py-2", children: [
+            /* @__PURE__ */ a("div", { className: "ttw:space-y-2", children: [
+              /* @__PURE__ */ e(m, { htmlFor: "group-admin-name", children: t.nameLabel }),
+              /* @__PURE__ */ e(
+                D,
+                {
+                  id: "group-admin-name",
+                  value: d,
+                  placeholder: t.namePlaceholder,
+                  onChange: (n) => p(n.target.value)
+                }
+              )
+            ] }),
+            /* @__PURE__ */ a("div", { className: "ttw:space-y-2", children: [
+              /* @__PURE__ */ e(m, { children: t.membersLabel }),
+              /* @__PURE__ */ e(
+                N,
                 {
-                  items: e.assignedAvatars,
-                  overflowLabel: e.assignedOverflowLabel,
-                  label: e.membersLabel
+                  multiple: !0,
+                  items: h,
+                  value: u,
+                  placeholder: t.membersSearchPlaceholder,
+                  emptyMessage: t.membersEmptyMessage,
+                  onValueChange: w
                 }
-              ) : /* @__PURE__ */ t("span", { className: "ttw:text-sm ttw:text-muted-foreground", children: e.membersLabel }),
-              /* @__PURE__ */ t("div", { className: "ttw:flex ttw:justify-end", children: e.onEdit || e.onDelete ? /* @__PURE__ */ s(x, { children: [
-                /* @__PURE__ */ t(b, { asChild: !0, children: /* @__PURE__ */ t(
-                  d,
-                  {
-                    variant: "ghost",
-                    size: "icon-sm",
-                    className: "ttw:text-muted-foreground",
-                    "aria-label": `${r.rowActionsAriaLabel} ${e.name}`,
-                    children: /* @__PURE__ */ t(p, { className: "ttw:size-4" })
-                  }
-                ) }),
-                /* @__PURE__ */ s(N, { align: "end", className: "ttw:min-w-44", children: [
-                  e.onEdit ? /* @__PURE__ */ s(o, { onClick: e.onEdit, children: [
-                    /* @__PURE__ */ t(g, { className: "ttw:size-4" }),
-                    r.editAction
-                  ] }) : null,
-                  e.onDelete ? /* @__PURE__ */ s(o, { onClick: e.onDelete, children: [
-                    /* @__PURE__ */ t(h, { className: "ttw:size-4 ttw:text-destructive" }),
-                    r.deleteAction
-                  ] }) : null
-                ] })
-              ] }) : null })
-            ]
-          },
-          e.key
-        )) })
-      ]
-    }
-  );
+              )
+            ] }),
+            s ? /* @__PURE__ */ e(A, { children: s }) : null
+          ] }),
+          /* @__PURE__ */ a(E, { className: "ttw:flex-row ttw:items-center ttw:justify-between", children: [
+            l && o ? /* @__PURE__ */ e(
+              r,
+              {
+                type: "button",
+                variant: "ghost",
+                className: "ttw:px-0 ttw:text-destructive ttw:hover:bg-transparent ttw:hover:text-destructive",
+                onClick: o,
+                children: t.deleteButton
+              }
+            ) : /* @__PURE__ */ e("span", {}),
+            /* @__PURE__ */ a("div", { className: "ttw:flex ttw:items-center ttw:gap-2", children: [
+              /* @__PURE__ */ e(
+                r,
+                {
+                  type: "button",
+                  variant: "ghost",
+                  onClick: () => i(!1),
+                  children: t.cancelButton
+                }
+              ),
+              /* @__PURE__ */ e(r, { type: "submit", disabled: b, children: t.saveButton })
+            ] })
+          ] })
+        ]
+      }
+    )
+  ] }) });
 }
 export {
-  z as GroupAdminPanel
+  P as GroupAdminDrawer
 };

package/dist/libs/tesouro-embedded-components-react/team-widget/ui/dist/index7.js

@@ -1,17 +1,16 @@
-const o = {
-  title: "Groups",
-  addButton: "Add",
-  nameColumn: "Name",
-  assignedColumn: "Assigned",
-  actionsColumn: "Actions",
-  editAction: "Edit",
-  deleteAction: "Delete",
-  emptyMessage: "No groups found.",
-  loadingLabel: "Loading groups",
-  errorTitle: "Unable to load",
-  errorDescription: "Something went wrong. Please try again.",
-  rowActionsAriaLabel: "Actions for"
+const e = {
+  createTitle: "Add group",
+  editTitle: "Edit group",
+  description: "Name the group and assign members.",
+  nameLabel: "Name",
+  namePlaceholder: "Enter a name",
+  membersLabel: "Members",
+  membersSearchPlaceholder: "Search members",
+  membersEmptyMessage: "No members found.",
+  cancelButton: "Cancel",
+  saveButton: "Save",
+  deleteButton: "Delete"
 };
 export {
-  o as DEFAULT_GROUP_ADMIN_PANEL_LABELS
+  e as DEFAULT_GROUP_ADMIN_DRAWER_LABELS
 };

package/dist/libs/tesouro-embedded-components-react/team-widget/ui/dist/index8.js

@@ -1,297 +1,106 @@
 "use client";
-import { jsxs as r, jsx as e } from "react/jsx-runtime";
-import { useRef as R, useEffect as T } from "react";
-import { ArrowLeftIcon as V } from "lucide-react";
-import { Button as f, Label as d, Input as N, RadioGroup as B, RadioGroupItem as D, Select as I, SelectTrigger as _, SelectValue as A, SelectContent as j, SelectItem as C } from "../../../../../packages/shared-ui-shadcn/dist/index.js";
-import "@radix-ui/react-use-controllable-state";
-import "../../../shared/ui/dist/lib/UIContext/UIContext.js";
-import { InlineErrorAlert as z } from "../../../shared/ui/dist/lib/InlineErrorAlert/InlineErrorAlert.js";
-import { DEFAULT_LABELS as H } from "./index14.js";
-function h({ id: i, message: s }) {
-  return /* @__PURE__ */ e("p", { id: i, className: "ttw:text-sm ttw:text-destructive", children: s });
-}
-const M = "__none__";
-function L({
-  id: i,
-  label: s,
-  value: c,
-  options: v,
-  placeholder: b,
-  emptyMessage: g,
-  loadingMessage: p,
-  noneLabel: u,
-  isLoading: n = !1,
-  disabled: w,
-  onValueChange: m
+import { jsxs as s, jsx as t } from "react/jsx-runtime";
+import { Plus as f, MoreVertical as p, Pencil as g, Trash2 as h } from "lucide-react";
+import { Button as d, Skeleton as i, DropdownMenu as x, DropdownMenuTrigger as b, DropdownMenuContent as N, DropdownMenuItem as o } from "../../../../../packages/shared-ui-shadcn/dist/index.js";
+import { AvatarStack as v } from "./index4.js";
+import { DEFAULT_GROUP_ADMIN_PANEL_LABELS as A } from "./index9.js";
+const y = 4;
+function z({
+  rows: n,
+  icon: w,
+  isLoading: a = !1,
+  isError: c = !1,
+  onAddClick: l,
+  labels: m
 }) {
-  const l = v.length > 0;
-  return /* @__PURE__ */ r("div", { className: "ttw:space-y-2", children: [
-    /* @__PURE__ */ e(d, { htmlFor: i, children: s }),
-    /* @__PURE__ */ r(
-      I,
-      {
-        value: c || void 0,
-        disabled: w || n || !l,
-        onValueChange: (o) => m(o === M ? "" : o),
-        children: [
-          /* @__PURE__ */ e(_, { id: i, className: "ttw:w-full", children: /* @__PURE__ */ e(A, { placeholder: n ? p : l ? b : g }) }),
-          /* @__PURE__ */ r(j, { children: [
-            c ? /* @__PURE__ */ e(C, { value: M, children: u }) : null,
-            v.map((o) => /* @__PURE__ */ e(C, { value: o.value, children: o.label }, o.value))
-          ] })
-        ]
-      }
-    )
-  ] });
-}
-function Q({
-  form: i,
-  roleOptions: s,
-  departmentOptions: c,
-  locationOptions: v,
-  reportingManagerOptions: b,
-  departmentsLoading: g = !1,
-  locationsLoading: p = !1,
-  reportingManagersLoading: u = !1,
-  errors: n,
-  submitErrorMessage: w,
-  isSubmitting: m = !1,
-  onFormChange: l,
-  onBackClick: o,
-  onCancel: S,
-  onSubmit: E,
-  labels: O
-}) {
-  const t = { ...H, ...O }, y = R(null);
-  return T(() => {
-    y.current?.focus();
-  }, []), /* @__PURE__ */ r(
+  const r = { ...A, ...m };
+  return /* @__PURE__ */ s(
     "section",
     {
-      "aria-label": t.inviteTitle,
-      className: "ttw:rounded-md ttw:border ttw:border-border ttw:bg-white ttw:p-4",
+      "aria-label": r.title,
+      "aria-busy": a || void 0,
+      className: "ttw:overflow-hidden ttw:rounded-md ttw:border ttw:border-border ttw:bg-background",
       children: [
-        /* @__PURE__ */ r(
-          f,
+        /* @__PURE__ */ s("div", { className: "ttw:flex ttw:items-center ttw:justify-between ttw:gap-4 ttw:border-b ttw:border-border ttw:p-3", children: [
+          /* @__PURE__ */ t("h2", { className: "ttw:text-lg ttw:font-semibold ttw:text-foreground", children: r.title }),
+          l && /* @__PURE__ */ s(d, { size: "sm", disabled: a, onClick: l, children: [
+            /* @__PURE__ */ t(f, { "aria-hidden": !0, className: "ttw:size-4" }),
+            r.addButton
+          ] })
+        ] }),
+        /* @__PURE__ */ s(
+          "div",
           {
-            ref: y,
-            variant: "ghost",
-            size: "sm",
-            disabled: m,
-            onClick: o,
+            className: "ttw:grid ttw:grid-cols-[2fr_2fr_80px] ttw:items-center ttw:gap-4 ttw:border-b ttw:border-border ttw:px-4 ttw:py-2.5",
+            role: "row",
             children: [
-              /* @__PURE__ */ e(V, { "aria-hidden": !0, className: "ttw:size-4" }),
-              t.inviteBackToTeamButton
+              /* @__PURE__ */ t("span", { className: "ttw:text-sm ttw:font-medium ttw:text-foreground", children: r.nameColumn }),
+              /* @__PURE__ */ t("span", { className: "ttw:text-sm ttw:font-medium ttw:text-foreground", children: r.assignedColumn }),
+              /* @__PURE__ */ t("span", { className: "ttw:text-right ttw:text-sm ttw:font-medium ttw:text-foreground", children: r.actionsColumn })
             ]
           }
         ),
-        /* @__PURE__ */ e("h3", { className: "ttw:mt-4 ttw:text-lg ttw:font-semibold ttw:text-foreground", children: t.inviteTitle }),
-        /* @__PURE__ */ e(
-          "form",
+        c ? /* @__PURE__ */ s("div", { className: "ttw:flex ttw:flex-col ttw:items-center ttw:justify-center ttw:px-4 ttw:py-14 ttw:text-center", children: [
+          /* @__PURE__ */ t("h3", { className: "ttw:mb-2 ttw:text-lg ttw:font-bold ttw:tracking-tight ttw:text-foreground", children: r.errorTitle }),
+          /* @__PURE__ */ t("p", { className: "ttw:max-w-sm ttw:text-sm ttw:text-muted-foreground", children: r.errorDescription })
+        ] }) : a ? /* @__PURE__ */ t("div", { "aria-label": r.loadingLabel, role: "status", children: Array.from({ length: y }).map((e, u) => /* @__PURE__ */ s(
+          "div",
           {
-            noValidate: !0,
-            className: "ttw:mt-4",
-            onSubmit: (a) => {
-              a.preventDefault(), E();
-            },
-            children: /* @__PURE__ */ r("fieldset", { className: "ttw:space-y-6", disabled: m, children: [
-              /* @__PURE__ */ r("div", { className: "ttw:space-y-4", children: [
-                /* @__PURE__ */ e("h4", { className: "ttw:text-base ttw:font-semibold ttw:text-foreground", children: t.inviteDetailsSectionHeading }),
-                /* @__PURE__ */ r("div", { className: "ttw:grid ttw:grid-cols-1 ttw:gap-4 ttw:sm:grid-cols-2", children: [
-                  /* @__PURE__ */ r("div", { className: "ttw:space-y-2", children: [
-                    /* @__PURE__ */ e(d, { htmlFor: "team-invite-first-name", children: t.inviteFirstNameLabel }),
-                    /* @__PURE__ */ e(
-                      N,
-                      {
-                        id: "team-invite-first-name",
-                        name: "firstName",
-                        autoComplete: "given-name",
-                        placeholder: t.inviteFirstNameLabel,
-                        value: i.firstName,
-                        "aria-invalid": n?.firstName ? !0 : void 0,
-                        "aria-describedby": n?.firstName ? "team-invite-first-name-error" : void 0,
-                        onChange: (a) => l({ ...i, firstName: a.target.value })
-                      }
-                    ),
-                    n?.firstName && /* @__PURE__ */ e(
-                      h,
-                      {
-                        id: "team-invite-first-name-error",
-                        message: n.firstName
-                      }
-                    )
-                  ] }),
-                  /* @__PURE__ */ r("div", { className: "ttw:space-y-2", children: [
-                    /* @__PURE__ */ e(d, { htmlFor: "team-invite-last-name", children: t.inviteLastNameLabel }),
-                    /* @__PURE__ */ e(
-                      N,
-                      {
-                        id: "team-invite-last-name",
-                        name: "lastName",
-                        autoComplete: "family-name",
-                        placeholder: t.inviteLastNameLabel,
-                        value: i.lastName,
-                        "aria-invalid": n?.lastName ? !0 : void 0,
-                        "aria-describedby": n?.lastName ? "team-invite-last-name-error" : void 0,
-                        onChange: (a) => l({ ...i, lastName: a.target.value })
-                      }
-                    ),
-                    n?.lastName && /* @__PURE__ */ e(
-                      h,
-                      {
-                        id: "team-invite-last-name-error",
-                        message: n.lastName
-                      }
-                    )
-                  ] })
-                ] }),
-                /* @__PURE__ */ r("div", { className: "ttw:space-y-2", children: [
-                  /* @__PURE__ */ e(d, { htmlFor: "team-invite-email", children: t.inviteWorkEmailLabel }),
-                  /* @__PURE__ */ e(
-                    N,
-                    {
-                      id: "team-invite-email",
-                      name: "email",
-                      type: "email",
-                      autoComplete: "email",
-                      placeholder: t.inviteWorkEmailLabel,
-                      value: i.email,
-                      "aria-invalid": n?.email ? !0 : void 0,
-                      "aria-describedby": n?.email ? "team-invite-email-error" : void 0,
-                      onChange: (a) => l({ ...i, email: a.target.value })
-                    }
-                  ),
-                  n?.email && /* @__PURE__ */ e(
-                    h,
-                    {
-                      id: "team-invite-email-error",
-                      message: n.email
-                    }
-                  )
-                ] }),
-                /* @__PURE__ */ r("div", { className: "ttw:grid ttw:grid-cols-1 ttw:gap-4 ttw:sm:grid-cols-2", children: [
-                  /* @__PURE__ */ e(
-                    L,
-                    {
-                      id: "team-invite-department",
-                      label: t.inviteDepartmentLabel,
-                      value: i.department,
-                      options: c,
-                      placeholder: t.inviteDepartmentPlaceholder,
-                      emptyMessage: t.inviteDepartmentEmpty,
-                      loadingMessage: t.inviteOptionsLoading,
-                      noneLabel: t.inviteOptionNone,
-                      isLoading: g,
-                      onValueChange: (a) => l({ ...i, department: a })
-                    }
-                  ),
-                  /* @__PURE__ */ e(
-                    L,
-                    {
-                      id: "team-invite-location",
-                      label: t.inviteLocationLabel,
-                      value: i.location,
-                      options: v,
-                      placeholder: t.inviteLocationPlaceholder,
-                      emptyMessage: t.inviteLocationEmpty,
-                      loadingMessage: t.inviteOptionsLoading,
-                      noneLabel: t.inviteOptionNone,
-                      isLoading: p,
-                      onValueChange: (a) => l({ ...i, location: a })
-                    }
-                  )
-                ] }),
-                /* @__PURE__ */ e(
-                  L,
-                  {
-                    id: "team-invite-reporting-manager",
-                    label: t.inviteReportingManagerLabel,
-                    value: i.reportingManager,
-                    options: b,
-                    placeholder: t.inviteReportingManagerPlaceholder,
-                    emptyMessage: t.inviteReportingManagerEmpty,
-                    loadingMessage: t.inviteOptionsLoading,
-                    noneLabel: t.inviteOptionNone,
-                    isLoading: u,
-                    onValueChange: (a) => l({ ...i, reportingManager: a })
-                  }
-                )
-              ] }),
-              /* @__PURE__ */ r("div", { className: "ttw:space-y-1", children: [
-                /* @__PURE__ */ e(
-                  "div",
-                  {
-                    id: "team-invite-role-heading",
-                    className: "ttw:text-base ttw:font-semibold ttw:text-foreground",
-                    children: t.inviteRoleSectionHeading
-                  }
-                ),
-                /* @__PURE__ */ e("p", { className: "ttw:text-sm ttw:text-muted-foreground", children: t.inviteRoleSectionDescription }),
-                /* @__PURE__ */ e(
-                  B,
-                  {
-                    className: "ttw:mt-3 ttw:gap-3",
-                    value: i.role || void 0,
-                    "aria-labelledby": "team-invite-role-heading",
-                    "aria-invalid": n?.role ? !0 : void 0,
-                    "aria-describedby": n?.role ? "team-invite-role-error" : void 0,
-                    onValueChange: (a) => l({ ...i, role: a }),
-                    children: s.map((a) => {
-                      const F = a.icon, k = i.role === a.value, x = `team-invite-role-${a.value}`;
-                      return /* @__PURE__ */ r(
-                        d,
-                        {
-                          htmlFor: x,
-                          className: `ttw:flex ttw:w-full ttw:cursor-pointer ttw:items-start ttw:gap-3 ttw:rounded-xl ttw:border ttw:bg-white ttw:p-4 ${k ? "ttw:border-primary ttw:ring-1 ttw:ring-primary" : "ttw:border-border"}`,
-                          children: [
-                            /* @__PURE__ */ e(
-                              D,
-                              {
-                                id: x,
-                                value: a.value,
-                                className: "ttw:mt-0.5"
-                              }
-                            ),
-                            /* @__PURE__ */ e(
-                              F,
-                              {
-                                "aria-hidden": !0,
-                                className: "ttw:mt-0.5 ttw:size-4 ttw:shrink-0 ttw:text-foreground"
-                              }
-                            ),
-                            /* @__PURE__ */ r("span", { className: "ttw:flex ttw:min-w-0 ttw:flex-1 ttw:flex-col ttw:gap-1", children: [
-                              /* @__PURE__ */ e("span", { className: "ttw:text-sm ttw:font-semibold ttw:text-foreground", children: a.label }),
-                              a.description ? /* @__PURE__ */ e("span", { className: "ttw:text-sm ttw:font-normal ttw:leading-normal ttw:text-muted-foreground", children: a.description }) : null
-                            ] })
-                          ]
-                        },
-                        a.value
-                      );
-                    })
-                  }
-                ),
-                n?.role && /* @__PURE__ */ e(h, { id: "team-invite-role-error", message: n.role })
+            className: "ttw:grid ttw:grid-cols-[2fr_2fr_80px] ttw:items-center ttw:gap-4 ttw:px-4 ttw:py-3",
+            children: [
+              /* @__PURE__ */ t(i, { className: "ttw:h-4 ttw:w-40" }),
+              /* @__PURE__ */ t(i, { className: "ttw:h-4 ttw:w-24" }),
+              /* @__PURE__ */ t("div", { className: "ttw:flex ttw:justify-end", children: /* @__PURE__ */ t(i, { className: "ttw:size-8 ttw:rounded-full" }) })
+            ]
+          },
+          u
+        )) }) : n.length === 0 ? /* @__PURE__ */ t("div", { className: "ttw:px-4 ttw:py-12 ttw:text-center ttw:text-sm ttw:text-muted-foreground", children: r.emptyMessage }) : /* @__PURE__ */ t("div", { className: "ttw:divide-y ttw:divide-border", children: n.map((e) => /* @__PURE__ */ s(
+          "div",
+          {
+            className: "ttw:grid ttw:grid-cols-[2fr_2fr_80px] ttw:items-center ttw:gap-4 ttw:px-4 ttw:py-3",
+            children: [
+              /* @__PURE__ */ s("div", { className: "ttw:flex ttw:items-center ttw:gap-2", children: [
+                /* @__PURE__ */ t("span", { "aria-hidden": !0, className: "ttw:text-muted-foreground", children: w }),
+                /* @__PURE__ */ t("span", { className: "ttw:text-sm ttw:font-medium ttw:text-foreground ttw:first-letter:uppercase", children: e.name })
               ] }),
-              w && /* @__PURE__ */ e(z, { children: w }),
-              /* @__PURE__ */ r("div", { className: "ttw:flex ttw:justify-end ttw:gap-2", children: [
-                /* @__PURE__ */ e(f, { type: "button", variant: "ghost", onClick: S, children: t.inviteCancelButton }),
-                /* @__PURE__ */ e(
-                  f,
+              e.assignedAvatars && e.assignedAvatars.length > 0 ? /* @__PURE__ */ t(
+                v,
+                {
+                  items: e.assignedAvatars,
+                  overflowLabel: e.assignedOverflowLabel,
+                  label: e.membersLabel
+                }
+              ) : /* @__PURE__ */ t("span", { className: "ttw:text-sm ttw:text-muted-foreground", children: e.membersLabel }),
+              /* @__PURE__ */ t("div", { className: "ttw:flex ttw:justify-end", children: e.onEdit || e.onDelete ? /* @__PURE__ */ s(x, { children: [
+                /* @__PURE__ */ t(b, { asChild: !0, children: /* @__PURE__ */ t(
+                  d,
                   {
-                    type: "submit",
-                    loading: m,
-                    disabled: g || p || u,
-                    children: t.inviteSubmitButton
+                    variant: "ghost",
+                    size: "icon-sm",
+                    className: "ttw:text-muted-foreground",
+                    "aria-label": `${r.rowActionsAriaLabel} ${e.name}`,
+                    children: /* @__PURE__ */ t(p, { className: "ttw:size-4" })
                   }
-                )
-              ] })
-            ] })
-          }
-        )
+                ) }),
+                /* @__PURE__ */ s(N, { align: "end", className: "ttw:min-w-44", children: [
+                  e.onEdit ? /* @__PURE__ */ s(o, { onClick: e.onEdit, children: [
+                    /* @__PURE__ */ t(g, { className: "ttw:size-4" }),
+                    r.editAction
+                  ] }) : null,
+                  e.onDelete ? /* @__PURE__ */ s(o, { onClick: e.onDelete, children: [
+                    /* @__PURE__ */ t(h, { className: "ttw:size-4 ttw:text-destructive" }),
+                    r.deleteAction
+                  ] }) : null
+                ] })
+              ] }) : null })
+            ]
+          },
+          e.key
+        )) })
       ]
     }
   );
 }
 export {
-  Q as InviteTeamMemberForm
+  z as GroupAdminPanel
 };