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

React component library

import { jsx as n } from "react/jsx-runtime";
import { forwardRef as z } from "react";
import { P as o } from "./index-S5Cd7WrG.js";
import { n as I } from "./emotion-styled.browser.esm-CjCaF13H.js";
import { c as b, b as h } from "./utils-DtRLzzTZ.js";
import { u as p } from "./emotion-element-f0de968e.browser.esm-CkCiQliQ.js";
const $ = I.span`
  box-sizing: border-box;
  ${(e) => e.sizeInUnits && e.sizeInUnits != "" ? `font-size: ${e.sizeInUnits}` : b(e.theme, "Icon", e.size, "enabled")};
  ${(e) => e.color && `color: ${h(
  e.theme,
  "Icon",
  e.color,
  "enabled",
  "icon"
)}`};
  display: inline-flex;
  justify-content: center;
  align-items: center;
`, x = z((e, t) => {
  const {
    id: U = "",
    icon: s = "",
    iconStyle: i = "solid",
    tooltip: r = "",
    sizeInUnits: a = "",
    size: l = "small",
    color: c,
    className: m = "",
    style: f = {},
    ...d
  } = e, g = { theme: p(), size: l, color: c, sizeInUnits: a }, y = () => {
    var u = i === "solid" ? "fas" : "far";
    return `${u} fa-${s} fa-fw`;
  };
  return /* @__PURE__ */ n(
    $,
    {
      ref: t,
      ...g,
      tooltip: r,
      className: m,
      style: f,
      ...d,
      children: /* @__PURE__ */ n(
        "i",
        {
          "data-control": !!e["data-control"],
          className: y()
        }
      )
    }
  );
});
x.propTypes = {
  id: o.string,
  icon: o.string,
  iconStyle: o.oneOf(["solid", "regular"]),
  tooltip: o.string,
  //----------------
  className: o.string,
  style: o.object,
  size: o.oneOf(["small", "medium", "large"]),
  /**
    Size in one of the css units (px, rem, em, ... ), sizeInUnits overrides size property
   */
  sizeInUnits: o.string,
  color: o.oneOf([
    "primary",
    "secondary",
    "success",
    "danger",
    "warning",
    "information",
    "neutral",
    "gray"
  ])
};
export {
  x as default
};