@lanaco/lnc-react-ui/dist/ActionsToolbar.js

React component library

import { jsxs as p, jsx as o } from "react/jsx-runtime";
import { forwardRef as M } from "react";
import { s as V } from "./emotion-styled.browser.esm-DfbrHHed.js";
import Z from "./DropdownMenu.js";
import a from "./DropdownItem.js";
import _ from "./Separator.js";
import c from "./Button.js";
import { c as m } from "./utils-BUdHa0nB.js";
import { useTheme as q } from "./ThemeProvider.js";
import { d as F } from "./breakpoints-BubDitvo.js";
const G = V.div`
  display: flex;
  align-items: center;
  border-radius: 8px;
  padding: 6px;
  margin-bottom: 12px;
  font-weight: 700;
  font-size: 0.875rem;
  color: rgba(15, 23, 42, 100%);
  background-color: ${(t) => m(
  t.theme,
  "Toolbar",
  t.color,
  "enabled",
  "background",
  "backgroundOpacity"
)};
  border: ${(t) => `1px solid ${m(
  t.theme,
  "Toolbar",
  t.color,
  "enabled",
  "border",
  "borderOpacity"
)}`};
  gap: 6px;
  justify-content: space-between;
  flex-wrap: wrap;
  & > div {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
  }

  @media ${F("S")} {
    gap: 4px;
    padding: 4px;
    margin-bottom: 8px;
    & > div {
      gap: 0.25rem;
    }
  }
`, H = M((t, b) => {
  const {
    showCreate: f = !0,
    enableCreate: u = !0,
    createText: s = "Create new item",
    showEdit: w = !0,
    enableEditOnSelection: x = !0,
    editText: y = "Edit",
    showDelete: g = !0,
    enableDeleteOnSelection: h = !0,
    deleteText: C = "Delete",
    showCopy: T = !0,
    enableCopyOnSelection: O = !0,
    copyText: D = "Copy",
    actionsText: S = "Actions",
    customActions: i,
    selectedRowsLength: r = 0,
    readOnly: n = !1,
    actionDropdownProps: k,
    actionsDropdownZIndex: v,
    actionsDropdownPlacement: I,
    //----------------
    onCreate: N = () => {
    },
    onEdit: R = () => {
    },
    onDelete: $ = () => {
    },
    onCopy: A = () => {
    },
    className: E = "",
    style: j = {},
    color: l = "primary",
    size: d = "small",
    selectedRows: z,
    ...B
  } = t, { theme: L } = q();
  return /* @__PURE__ */ p(
    G,
    {
      ref: b,
      theme: L,
      color: l,
      className: `lnc-table-view-actions-toolbar ${E}`,
      style: j,
      ...B,
      children: [
        /* @__PURE__ */ o("div", { children: f && n == !1 && /* @__PURE__ */ o(
          c,
          {
            leadingIcon: "plus",
            btnType: "outline",
            type: "button",
            color: l,
            size: d,
            title: s,
            disabled: !u,
            onClick: N,
            text: s
          }
        ) }),
        /* @__PURE__ */ o("div", { children: /* @__PURE__ */ p(
          Z,
          {
            className: "lnc-table-view-actions-toolbar-dropdown",
            color: l,
            size: d,
            zIndex: v,
            placement: I,
            ...k,
            control: /* @__PURE__ */ o(
              c,
              {
                text: S,
                btnType: "outline",
                trailingIcon: "angle-down",
                color: l,
                size: d,
                type: "button"
              }
            ),
            children: [
              T && n == !1 && /* @__PURE__ */ o(
                a,
                {
                  icon: "copy",
                  disabled: !(O && r > 0),
                  onClick: A,
                  children: D
                }
              ),
              w && n == !1 && /* @__PURE__ */ o(
                a,
                {
                  icon: "pen",
                  disabled: !(x && r > 0),
                  onClick: R,
                  children: y
                }
              ),
              g && n == !1 && /* @__PURE__ */ o(
                a,
                {
                  icon: "trash",
                  disabled: !(h && r > 0),
                  onClick: $,
                  children: C
                }
              ),
              /* @__PURE__ */ o(_, {}),
              i == null ? void 0 : i.map((e, P) => {
                if ((e == null ? void 0 : e.show) != !1)
                  return /* @__PURE__ */ o(
                    a,
                    {
                      icon: e.icon,
                      disabled: !(e.enableOnSelection == !0 && r > 0 || e.enable == !0 && e.enableOnSelection == !1),
                      onClick: () => {
                        e.onAction(z);
                      },
                      children: e.name
                    },
                    P
                  );
              })
            ]
          }
        ) })
      ]
    }
  );
});
H.displayName = "ACTIONS_TOOLBAR";
export {
  H as default
};