@hakit/components/dist/es/Shared/Alert/index.js

A series of components to work with @hakit/core

import { a as i, j as o } from "../../../emotion-react-jsx-runtime.browser.esm-Tq_btErF.js";
import { c as d } from "../../../emotion-styled-base.browser.esm-Dyg8Y4aq.js";
import { css as f } from "@emotion/react";
import { Icon as g } from "@iconify/react";
function m() {
  return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop).";
}
const p = {
  info: "mdi:information-outline",
  warning: "mdi:alert-outline",
  error: "mdi:alert-circle-outline",
  success: "mdi:check-circle-outline"
}, h = /* @__PURE__ */ d("div", process.env.NODE_ENV === "production" ? {
  target: "e1jy14t0"
} : {
  target: "e1jy14t0",
  label: "StyledAlert"
})(process.env.NODE_ENV === "production" ? {
  name: "1e4y0tn",
  styles: 'position:relative;padding:8px;display:flex;&:after{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;content:"";border-radius:6px;}.icon{z-index:1;}.content{display:flex;justify-content:space-between;align-items:center;width:100%;text-align:left;}.main-content{overflow-wrap:anywhere;word-break:break-word;margin-left:8px;margin-right:0;margin-inline-start:8px;margin-inline-end:0;}.title{font-weight:bold;font-size:0.8rem;line-height:1rem;color:var(--ha-S50-contrast);}.description{margin-top:2px;font-weight:normal;font-size:0.75rem;line-height:1rem;color:var(--ha-S100-contrast);}&.no-title{align-items:center;justify-content:center;.description{margin-top:0;}.icon{align-self:center;}}&.info>.icon{color:var(--ha-info-color);}&.info::after{background-color:var(--ha-info-color-a1);}&.warning>.icon{color:var(--ha-warning-color);}&.warning::after{background-color:var(--ha-warning-color-a1);}&.error>.icon{color:var(--ha-error-color);}&.error::after{background-color:var(--ha-error-color-a1);}&.success>.icon{color:var(--ha-success-color);}&.success::after{background-color:var(--ha-success-color-a1);}'
} : {
  name: "1e4y0tn",
  styles: 'position:relative;padding:8px;display:flex;&:after{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;content:"";border-radius:6px;}.icon{z-index:1;}.content{display:flex;justify-content:space-between;align-items:center;width:100%;text-align:left;}.main-content{overflow-wrap:anywhere;word-break:break-word;margin-left:8px;margin-right:0;margin-inline-start:8px;margin-inline-end:0;}.title{font-weight:bold;font-size:0.8rem;line-height:1rem;color:var(--ha-S50-contrast);}.description{margin-top:2px;font-weight:normal;font-size:0.75rem;line-height:1rem;color:var(--ha-S100-contrast);}&.no-title{align-items:center;justify-content:center;.description{margin-top:0;}.icon{align-self:center;}}&.info>.icon{color:var(--ha-info-color);}&.info::after{background-color:var(--ha-info-color-a1);}&.warning>.icon{color:var(--ha-warning-color);}&.warning::after{background-color:var(--ha-warning-color-a1);}&.error>.icon{color:var(--ha-error-color);}&.error::after{background-color:var(--ha-error-color-a1);}&.success>.icon{color:var(--ha-success-color);}&.success::after{background-color:var(--ha-success-color-a1);}',
  toString: m
});
function x({
  title: r = "",
  description: e = "",
  type: n = "info",
  onClick: a,
  className: c,
  children: t,
  cssStyles: l,
  ...s
}) {
  return /* @__PURE__ */ i(h, { css: /* @__PURE__ */ f(l ?? "", ";" + (process.env.NODE_ENV === "production" ? "" : ";label:Alert;")), onClick: a, className: `alert issue-type ${r ? "" : "no-title"} ${n} ${c ?? ""}`, role: "alert", ...s, children: [
    /* @__PURE__ */ o(g, { className: "icon", icon: p[n] }),
    /* @__PURE__ */ o("div", { className: "content", children: /* @__PURE__ */ i("div", { className: "main-content", children: [
      r ? /* @__PURE__ */ o("div", { className: "title", children: r }) : "",
      e ? /* @__PURE__ */ o("div", { className: "description", children: e }) : "",
      t && t
    ] }) })
  ] });
}
export {
  x as Alert
};
//# sourceMappingURL=index.js.map