alinea/dist/ui/Button.js

[](https://npmjs.org/package/alinea) [](https://packagephobia.com/result?p=alinea)

import "../chunks/chunk-U5RRZUYZ.js";

// src/ui/Button.module.scss
var Button_module_default = {
  "root": "alinea-Button",
  "is-medium": "alinea-Button-is-medium",
  "isMedium": "alinea-Button-is-medium",
  "is-large": "alinea-Button-is-large",
  "isLarge": "alinea-Button-is-large",
  "is-outline": "alinea-Button-is-outline",
  "isOutline": "alinea-Button-is-outline"
};

// src/ui/Button.tsx
import { Icon } from "./Icon.js";
import { HStack } from "./Stack.js";
import { fromModule } from "./util/Styler.js";
import { jsx, jsxs } from "react/jsx-runtime";
var styles = fromModule(Button_module_default);
function Button({
  as = "button",
  children,
  size = "medium",
  icon,
  iconRight,
  outline,
  ...props
}) {
  const Tag = as;
  return /* @__PURE__ */ jsx(Tag, { ...props, className: styles.root.mergeProps(props)(size, { outline }), children: /* @__PURE__ */ jsxs(HStack, { center: true, gap: 8, children: [
    /* @__PURE__ */ jsx(Icon, { icon, size: 18 }),
    /* @__PURE__ */ jsx("span", { children }),
    /* @__PURE__ */ jsx(Icon, { icon: iconRight })
  ] }) });
}
export {
  Button
};