impact-ui 3.7.34-alpha.2 → 3.7.34-alpha.3

package/dist/components/Breadcrumbs/index.js

@@ -0,0 +1,129 @@
+!function(){"use strict";try{if("undefined"!=typeof document){var e=document.createElement("style");e.appendChild(document.createTextNode(".ia-styles.ia-breadcrumb{color:#4259ee;cursor:pointer;font-family:Manrope,sans-serif;font-size:14px;font-weight:500;letter-spacing:-.01em;line-height:16.1px;text-align:left}.ia-styles.ia-breadcrumb.ia-breadcrumb-disabled{color:#60697d}.ia-styles.ia-breadcrumb.ia-breadcrumb-home svg{display:flex}.ia-styles.ia-breadcrumb.ia-breadcrumb-home svg path{height:11.67px;width:10.67px}.ia-styles.ia-breadcrumb.ia-breadcrumb-extras{margin-left:5px;margin-right:-1px}.ia-styles.ia-breadcrumb:hover:not(.ia-breadcrumb-noLink):not(.ia-breadcrumb-disabled){color:#4259ee}.ia-styles.ia-breadcrumb:hover:not(.ia-breadcrumb-noLink):not(.ia-breadcrumb-disabled) path{fill:#4259ee}.ia-styles.ia-breadcrumb.ia-breadcrumb-noLink{color:#1f2b4d;cursor:default;font-weight:800}.MuiBreadcrumbs-root .MuiBreadcrumbs-separator{font-size:20px;margin-left:0;margin-right:0;margin-top:3px}.MuiBreadcrumbs-root .MuiBreadcrumbs-li:has(>*>.ia-breadcrumb-extras){height:24px}.MuiBreadcrumbs-root .MuiBreadcrumbs-li:has(>*>.ia-breadcrumb-extras) div{align-items:center;display:flex}.ia-breadcrumb-extras svg{fill:#6b7280!important;margin-top:1px}")),document.head.appendChild(e)}}catch(r){console.error("vite-plugin-css-injected-by-js",r)}}();
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useState, useMemo } from "react";
+import default_1$1 from "../../node_modules/@mui/icons-material/KeyboardArrowRight.js";
+import default_1 from "../../node_modules/@mui/icons-material/MoreHoriz.js";
+import { HomeIcon } from "./HomeIcon.js";
+
+import Link from "../../node_modules/@mui/material/Link/Link.js";
+import Menu from "../../node_modules/@mui/material/Menu/Menu.js";
+import MenuItem from "../../node_modules/@mui/material/MenuItem/MenuItem.js";
+import Breadcrumbs$1 from "../../node_modules/@mui/material/Breadcrumbs/Breadcrumbs.js";
+function Breadcrumbs({
+  list,
+  className = "",
+  id,
+  "data-testid": dataTestId
+}) {
+  const [anchorEl, setAnchorEl] = useState(null);
+  const isOpen = Boolean(anchorEl);
+  const handleClick = (event) => {
+    setAnchorEl(event.currentTarget);
+  };
+  const onClose = () => {
+    setAnchorEl(null);
+  };
+  const breadCrumbList = useMemo(() => {
+    const filtered = list.filter((_, idx) => idx < 2 || idx > list.length - 3);
+    const temp = filtered.map((item, index, arr) => {
+      const isLast = index === arr.length - 1;
+      if (!isLast) {
+        return /* @__PURE__ */ jsx(
+          Link,
+          {
+            "aria-label": item.label === "Home" ? "Home" : void 0,
+            className: `ia-styles ia-breadcrumb ${item.label === "Home" ? "ia-breadcrumb-home" : ""} ${item.disabled ? "ia-breadcrumb-disabled" : ""}`,
+            href: !item.disabled && item.to ? item.to : void 0,
+            underline: "none",
+            onClick: !item.disabled && item.onClick ? (e) => {
+              var _a;
+              e.preventDefault();
+              (_a = item.onClick) == null ? void 0 : _a.call(item);
+            } : void 0,
+            children: item.label === "Home" ? /* @__PURE__ */ jsx(HomeIcon, {}) : item.label
+          },
+          item.label
+        );
+      }
+      return /* @__PURE__ */ jsx(
+        "span",
+        {
+          className: `ia-styles ia-breadcrumb ia-breadcrumb-noLink ${item.disabled ? "ia-breadcrumb-disabled" : ""}`.trim(),
+          children: item.label
+        },
+        item.label
+      );
+    });
+    const extras = list.filter((_, idx) => idx >= 2 && idx <= list.length - 3);
+    if (extras.length > 0 && temp.length > 1) {
+      const secondItem = temp[1];
+      temp[1] = /* @__PURE__ */ jsxs("div", { style: { display: "inline-flex" }, children: [
+        secondItem,
+        /* @__PURE__ */ jsx(
+          "div",
+          {
+            "aria-expanded": isOpen,
+            "aria-haspopup": "menu",
+            "aria-label": "More breadcrumb links",
+            className: "ia-styles ia-breadcrumb ia-breadcrumb-extras",
+            role: "button",
+            tabIndex: 0,
+            onClick: handleClick,
+            onKeyDown: (e) => {
+              if (e.key === "Enter" || e.key === " ") {
+                e.preventDefault();
+                handleClick(e);
+              }
+            },
+            children: /* @__PURE__ */ jsx(default_1, {})
+          },
+          "extras"
+        ),
+        /* @__PURE__ */ jsx(
+          Menu,
+          {
+            anchorEl,
+            anchorOrigin: { vertical: "bottom", horizontal: "left" },
+            MenuListProps: { "aria-label": "More breadcrumb links" },
+            open: isOpen,
+            transformOrigin: { vertical: "top", horizontal: "left" },
+            onClose,
+            children: extras.map((e) => /* @__PURE__ */ jsx(
+              MenuItem,
+              {
+                disabled: e.disabled,
+                onClick: () => {
+                  if (e.onClick) {
+                    e.onClick();
+                  } else if (e.to) {
+                    window.open(e.to);
+                  }
+                  onClose();
+                },
+                children: e.label
+              },
+              e.label
+            ))
+          }
+        )
+      ] }, "extras-wrapper");
+    }
+    return temp;
+  }, [list, isOpen]);
+  return /* @__PURE__ */ jsx(
+    Breadcrumbs$1,
+    {
+      "aria-label": "breadcrumb",
+      className,
+      "data-testid": dataTestId,
+      id,
+      separator: /* @__PURE__ */ jsx(default_1$1, { sx: { height: "15px", width: "12px" } }),
+      sx: { lineHeight: "21px" },
+      children: breadCrumbList
+    }
+  );
+}
+Breadcrumbs.displayName = "Breadcrumbs";
+export {
+  Breadcrumbs
+};

package/dist/components/Button/Button.types.d.ts

@@ -0,0 +1,52 @@
+import { ReactNode } from 'react';
+import { ButtonProps as MUIButtonProps } from '@mui/material/Button';
+import { BaseComponentProps } from '../../types';
+
+export type ConvertedVariant = 'contained' | 'outlined' | 'text' | 'tertiary' | 'link';
+export interface ButtonProps extends Omit<BaseComponentProps, 'children'>, Omit<MUIButtonProps, 'size' | 'variant' | 'type'> {
+    /**
+     * Button content
+     */
+    children?: ReactNode;
+    /**
+     * The size of the button
+     */
+    size?: 'small' | 'medium' | 'large';
+    /**
+     * The variant style of the button
+     */
+    variant?: 'primary' | 'contained' | 'secondary' | 'outlined' | 'tertiary' | 'text' | 'url';
+    /**
+     * Whether the button is in a loading state
+     */
+    loading?: boolean;
+    /**
+     * Icon to display in the button
+     */
+    icon?: ReactNode;
+    /**
+     * Placement of the icon relative to the label
+     */
+    iconPlacement?: 'left' | 'right';
+    /**
+     * Whether the button is disabled
+     */
+    disabled?: boolean;
+    /**
+     * The button type for styling purposes (not HTML button type)
+     */
+    type?: 'default' | 'destructive';
+    /**
+     * Native HTML button type (submit, reset, or button)
+     */
+    htmlType?: 'button' | 'submit' | 'reset';
+    /**
+     * Click handler for the button
+     */
+    onClick?: (event: React.MouseEvent<HTMLButtonElement>) => void;
+    /**
+     * Accessible label for screen readers (required if button has no text)
+     */
+    'aria-label'?: string;
+}
+//# sourceMappingURL=Button.types.d.ts.map

package/dist/components/Button/Button.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Button.types.d.ts","sourceRoot":"","sources":["../../../src/components/Button/Button.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,EAAE,KAAK,WAAW,IAAI,cAAc,EAAE,MAAM,sBAAsB,CAAC;AAC1E,OAAO,EAAE,KAAK,kBAAkB,EAAE,MAAM,aAAa,CAAC;AAEtD,MAAM,MAAM,gBAAgB,GAAG,WAAW,GAAG,UAAU,GAAG,MAAM,GAAG,UAAU,GAAG,MAAM,CAAC;AAEvF,MAAM,WAAW,WACf,SAAQ,IAAI,CAAC,kBAAkB,EAAE,UAAU,CAAC,EAAE,IAAI,CAAC,cAAc,EAAE,MAAM,GAAG,SAAS,GAAG,MAAM,CAAC;IAC/F;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB;;OAEG;IACH,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;IACpC;;OAEG;IACH,OAAO,CAAC,EAAE,SAAS,GAAG,WAAW,GAAG,WAAW,GAAG,UAAU,GAAG,UAAU,GAAG,MAAM,GAAG,KAAK,CAAC;IAC3F;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IACjC;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,IAAI,CAAC,EAAE,SAAS,GAAG,aAAa,CAAC;IACjC;;OAEG;IACH,QAAQ,CAAC,EAAE,QAAQ,GAAG,QAAQ,GAAG,OAAO,CAAC;IACzC;;OAEG;IACH,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;IAC/D;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB"}

package/dist/components/Button/index.d.ts

@@ -0,0 +1,10 @@
+import { ButtonProps } from './Button.types';
+
+export type { ButtonProps, ConvertedVariant } from './Button.types';
+/**
+ * Button component with loading states, icons, and multiple variants
+ * Meets WCAG 2.1 Level AA accessibility standards with proper focus and aria attributes
+ */
+export declare const Button: import('react').ForwardRefExoticComponent<Omit<ButtonProps, "ref"> & import('react').RefAttributes<HTMLButtonElement>>;
+export default Button;
+//# sourceMappingURL=index.d.ts.map

package/dist/components/Button/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Button/index.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,WAAW,EAAoB,MAAM,gBAAgB,CAAC;AACpE,OAAO,sBAAsB,CAAC;AAG9B,YAAY,EAAE,WAAW,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAEpE;;;GAGG;AACH,eAAO,MAAM,MAAM,wHAsJlB,CAAC;AAIF,eAAe,MAAM,CAAC"}

package/dist/components/Button/index.js

@@ -0,0 +1,128 @@
+!function(){"use strict";try{if("undefined"!=typeof document){var t=document.createElement("style");t.appendChild(document.createTextNode(".ia-styles.ia-btn{background-color:#4259ee;border-radius:8px;border-style:solid;border-width:1px;color:#fff;font-family:Manrope,sans-serif;font-size:14px;font-weight:400;gap:6px;height:32px;min-width:0;padding:6px 12px;text-transform:none}.ia-styles.ia-btn svg{color:inherit!important;height:16px;margin:0;padding:0;width:16px}.ia-styles.ia-btn svg path{fill:inherit!important}.ia-styles.ia-btn.ia-btn-with-icon{align-items:center;display:flex;gap:4px}.ia-styles.ia-btn.ia-btn-with-icon svg{color:inherit!important}.ia-styles.ia-btn.ia-btn-with-icon svg path{fill:inherit!important}.ia-styles.ia-btn.ia-btn-with-icon .ia-btn-loading-icon{align-items:center;animation:rotate 1s linear infinite;border-radius:50%;display:flex;height:16px;justify-content:center;margin-right:4px;width:16px}.ia-styles.ia-btn.ia-btn-only-icon{aspect-ratio:1/1}.ia-styles.ia-btn.ia-btn-large{height:32px}.ia-styles.ia-btn.ia-btn-medium{height:28px;padding:4px 12px}.ia-styles.ia-btn.ia-btn-small{height:24px;padding:2px 12px}.ia-styles.ia-btn.ia-btn-contained{border-width:0}.ia-styles.ia-btn.ia-btn-contained:hover{background-color:#29399f;color:#fff}.ia-styles.ia-btn.ia-btn-contained.ia-btn-disabled{background-color:#c3c8d4;border-width:0;color:#fff}.ia-styles.ia-btn.ia-btn-contained svg{color:#fff!important}.ia-styles.ia-btn.ia-btn-contained svg path{fill:#fff!important}.ia-styles.ia-btn.ia-btn-contained.ia-btn-destructive{background-color:#e15554;border-color:#c3c8d4;color:#fff}.ia-styles.ia-btn.ia-btn-contained.ia-btn-destructive:hover{background-color:#ab3939;border-color:#fceeee}.ia-styles.ia-btn.ia-btn-contained.ia-btn-destructive:focus:not(:hover){border-color:#fceeee}.ia-styles.ia-btn.ia-btn-contained.ia-btn-destructive.ia-btn-disabled{background-color:#c3c8d4;border-width:0;color:#fff}.ia-styles.ia-btn.ia-btn-contained.ia-btn-destructive.ia-btn-disabled svg{color:#fff!important}.ia-styles.ia-btn.ia-btn-contained.ia-btn-destructive.ia-btn-disabled svg path{fill:#fff!important}.ia-styles.ia-btn.ia-btn-outlined{background-color:#fff;border-color:#4259ee;color:#4259ee}.ia-styles.ia-btn.ia-btn-outlined:hover{background-color:#eceefd;border-color:#3649c6;border-width:1px;color:#3649c6}.ia-styles.ia-btn.ia-btn-outlined:hover svg{color:#3649c6!important}.ia-styles.ia-btn.ia-btn-outlined:hover svg path{fill:#3649c6!important}.ia-styles.ia-btn.ia-btn-outlined.ia-btn-disabled{background-color:#f8f9fb;border-color:#d9dde7;color:#b4bac7}.ia-styles.ia-btn.ia-btn-outlined.ia-btn-disabled svg{color:#b4bac7!important}.ia-styles.ia-btn.ia-btn-outlined.ia-btn-disabled svg path{fill:#b4bac7!important}.ia-styles.ia-btn.ia-btn-outlined svg{color:#3649c6!important}.ia-styles.ia-btn.ia-btn-outlined svg path{fill:#3649c6!important}.ia-styles.ia-btn.ia-btn-outlined.ia-btn-destructive{background-color:#fff;border-color:#c3c8d4;color:#1f2b4d}.ia-styles.ia-btn.ia-btn-outlined.ia-btn-destructive:hover{background-color:#fceeee;border-color:#e15554;color:#e15554}.ia-styles.ia-btn.ia-btn-outlined.ia-btn-destructive:hover svg{color:#e15554!important}.ia-styles.ia-btn.ia-btn-outlined.ia-btn-destructive:hover svg path{fill:#e15554!important}.ia-styles.ia-btn.ia-btn-outlined.ia-btn-destructive:focus{background-color:#fff;color:#e15554}.ia-styles.ia-btn.ia-btn-outlined.ia-btn-destructive:focus svg{color:#e15554!important}.ia-styles.ia-btn.ia-btn-outlined.ia-btn-destructive:focus svg path{fill:#e15554!important}.ia-styles.ia-btn.ia-btn-outlined.ia-btn-destructive:focus:not(:hover){border-color:#fceeee}.ia-styles.ia-btn.ia-btn-outlined.ia-btn-destructive svg{color:#1f2b4d!important}.ia-styles.ia-btn.ia-btn-outlined.ia-btn-destructive svg path{fill:#1f2b4d!important}.ia-styles.ia-btn.ia-btn-outlined.ia-btn-destructive.ia-btn-disabled{background-color:#f8f9fb;border-color:#d9dde7;color:#b4bac7}.ia-styles.ia-btn.ia-btn-outlined.ia-btn-destructive.ia-btn-disabled svg{color:#b4bac7!important}.ia-styles.ia-btn.ia-btn-outlined.ia-btn-destructive.ia-btn-disabled svg path{fill:#b4bac7!important}.ia-styles.ia-btn.ia-btn-text{background-color:#f5f6fa;border-width:0;color:#60697d}.ia-styles.ia-btn.ia-btn-text:hover{background-color:#eceefd;border-width:0;color:#3649c6}.ia-styles.ia-btn.ia-btn-text:hover svg{color:#3649c6!important}.ia-styles.ia-btn.ia-btn-text:hover svg path{fill:#3649c6!important}.ia-styles.ia-btn.ia-btn-text.ia-btn-disabled{background-color:#f8f9fb;border-width:0;color:#b4bac7}.ia-styles.ia-btn.ia-btn-text.ia-btn-disabled svg{color:#b4bac7!important}.ia-styles.ia-btn.ia-btn-text.ia-btn-disabled svg path{fill:#b4bac7!important}.ia-styles.ia-btn.ia-btn-text svg{color:#60697d!important}.ia-styles.ia-btn.ia-btn-text svg path{fill:#60697d!important}.ia-styles.ia-btn.ia-btn-link{background-color:initial;border:none;color:#4259ee;padding:0}.ia-styles.ia-btn.ia-btn-link:hover{background-color:initial;text-decoration:underline}.ia-styles.ia-btn.ia-btn-link.ia-btn-disabled{background-color:initial;border:none;color:#b4bac7}.ia-styles.ia-btn.ia-btn-link.ia-btn-disabled svg{color:#b4bac7!important}.ia-styles.ia-btn.ia-btn-link.ia-btn-disabled svg path{fill:#b4bac7!important}.ia-styles.ia-btn.ia-btn-link svg{color:#4259ee!important}.ia-styles.ia-btn.ia-btn-link svg path{fill:#4259ee!important}.ia-styles.ia-btn.ia-btn-tertiary{background-color:#fff;border-color:#c3c8d4;color:#1f2b4d}.ia-styles.ia-btn.ia-btn-tertiary:hover{background-color:#eceefd;border-color:#3649c6;border-width:1px;color:#3649c6}.ia-styles.ia-btn.ia-btn-tertiary:hover svg{color:#3649c6!important}.ia-styles.ia-btn.ia-btn-tertiary:hover svg path{fill:#3649c6!important}.ia-styles.ia-btn.ia-btn-tertiary:focus{background-color:#eceefd;border-color:#3649c6;border-width:1px;color:#3649c6}.ia-styles.ia-btn.ia-btn-tertiary.ia-btn-disabled{background-color:#f8f9fb;border-color:#d9dde7;color:#b4bac7}.ia-styles.ia-btn.ia-btn-tertiary.ia-btn-disabled svg{color:#b4bac7!important}.ia-styles.ia-btn.ia-btn-tertiary.ia-btn-disabled svg path{fill:#b4bac7!important}.ia-styles.ia-btn.ia-btn-tertiary svg{color:#1f2b4d!important}.ia-styles.ia-btn.ia-btn-tertiary svg path{fill:#1f2b4d!important}.ia-btn-loading-icon{display:flex}@keyframes loader{0%{transform:rotate(45deg)}to{transform:rotate(405deg)}}.ia-btn-loading-icon .ia-btn-loading-track{animation-delay:0s;animation-duration:1s;animation-iteration-count:infinite;animation-name:loader;animation-timing-function:linear;border-radius:50%;border-style:solid;border-width:2px;box-sizing:border-box;display:inline-block;height:14px;position:relative;width:14px}.ia-btn-loading-icon .ia-btn-loading-track.ia-btn-loading-light{border-color:#5f6673 #7a829440 #7a829440}.ia-btn-loading-icon .ia-btn-loading-track.ia-btn-loading-dark{border-color:#fff #edeefd40 #edeefd40}.ia-btn-icon{height:16px;margin-bottom:3px;width:16px}.ia-btn-icon-loading{height:14px;margin-bottom:0}")),document.head.appendChild(t)}}catch(i){console.error("vite-plugin-css-injected-by-js",i)}}();
+import { jsx, jsxs } from "react/jsx-runtime";
+import { forwardRef, useMemo } from "react";
+
+import Button$1 from "../../node_modules/@mui/material/Button/Button.js";
+const Button = forwardRef(
+  ({
+    children,
+    size = "large",
+    variant = "contained",
+    loading = false,
+    icon,
+    iconPlacement = "left",
+    disabled,
+    className = "",
+    type = "default",
+    htmlType = "button",
+    "aria-label": ariaLabel,
+    ...args
+  }, ref) => {
+    const convertedVariant = useMemo(() => {
+      switch (variant) {
+        case "secondary":
+        case "outlined":
+          return "outlined";
+        case "tertiary":
+          return "tertiary";
+        case "text":
+          return "text";
+        case "url":
+          return "link";
+        case "primary":
+        case "contained":
+        default:
+          return "contained";
+      }
+    }, [variant]);
+    const classStr = useMemo(() => {
+      let retVal = `ia-styles ia-btn ${type === "destructive" ? "ia-btn-destructive" : ""} ${className}`;
+      switch (convertedVariant) {
+        case "outlined":
+          retVal += " ia-btn-outlined";
+          break;
+        case "link":
+          retVal += " ia-btn-link";
+          break;
+        case "text":
+          retVal += " ia-btn-text";
+          break;
+        case "tertiary":
+          retVal += " ia-btn-tertiary";
+          break;
+        case "contained":
+        default:
+          retVal += " ia-btn-contained";
+          break;
+      }
+      switch (size) {
+        case "small":
+          retVal += " ia-btn-small";
+          break;
+        case "medium":
+          retVal += " ia-btn-medium";
+          break;
+        case "large":
+        default:
+          retVal += " ia-btn-large";
+          break;
+      }
+      if (disabled) {
+        retVal += " ia-btn-disabled";
+      }
+      if (icon) {
+        if (children) {
+          retVal += " ia-btn-with-icon";
+        } else {
+          retVal += " ia-btn-only-icon";
+        }
+      }
+      return retVal;
+    }, [children, convertedVariant, size, disabled, icon, type, className]);
+    const finalLabel = useMemo(() => {
+      if (variant === "url" && !disabled && loading && children) {
+        return "Loading...";
+      }
+      return children;
+    }, [variant, disabled, loading, children]);
+    const finalIcon = useMemo(() => {
+      if (!icon && !loading) {
+        return null;
+      }
+      return /* @__PURE__ */ jsx("div", { className: `ia-btn-icon ${loading ? "ia-btn-icon-loading" : ""}`, children: loading && (convertedVariant !== "link" || !children) ? /* @__PURE__ */ jsx("div", { "aria-hidden": "true", className: "ia-btn-loading-icon", children: /* @__PURE__ */ jsx(
+        "span",
+        {
+          className: `ia-btn-loading-track ia-btn-loading-${convertedVariant === "contained" ? "dark" : "light"}`
+        }
+      ) }) : icon });
+    }, [icon, loading, convertedVariant, children]);
+    const computedAriaLabel = ariaLabel ?? (typeof children === "string" ? void 0 : "Button");
+    const isDisabled = disabled ?? loading;
+    const commonProps = {
+      ref,
+      disabled: isDisabled,
+      className: classStr,
+      disableRipple: true,
+      disableElevation: true,
+      type: htmlType,
+      "aria-label": computedAriaLabel,
+      "aria-busy": loading,
+      "aria-disabled": isDisabled,
+      ...args
+    };
+    if (iconPlacement === "right") {
+      return /* @__PURE__ */ jsxs(Button$1, { ...commonProps, children: [
+        finalLabel,
+        finalIcon
+      ] });
+    }
+    return /* @__PURE__ */ jsxs(Button$1, { ...commonProps, children: [
+      finalIcon,
+      finalLabel
+    ] });
+  }
+);
+Button.displayName = "Button";
+export {
+  Button
+};

package/dist/components/ButtonGroup/ButtonGroup.types.d.ts

@@ -0,0 +1,28 @@
+import { ReactNode } from 'react';
+import { ToggleButtonGroupProps } from '@mui/material/ToggleButtonGroup';
+import { BaseComponentProps } from '../../types';
+
+/**
+ * Single option in the button group
+ */
+export interface ButtonGroupOption {
+    /** Value when this option is selected */
+    value: string;
+    /** Label text */
+    label: string;
+    /** Optional icon (e.g. MUI icon) */
+    icon?: ReactNode;
+    /** Whether this option is disabled */
+    disabled?: boolean;
+}
+export interface ButtonGroupProps extends BaseComponentProps, Omit<ToggleButtonGroupProps, 'value' | 'onChange' | 'children'> {
+    /** Options to render as toggle buttons */
+    options: ButtonGroupOption[];
+    /** Currently selected value (controlled) */
+    selectedOption: string;
+    /** Called when selection changes */
+    onChange?: (e: React.MouseEvent<HTMLElement>, value: string | null) => void;
+    /** Disable the entire group */
+    isDisabled?: boolean;
+}
+//# sourceMappingURL=ButtonGroup.types.d.ts.map

package/dist/components/ButtonGroup/ButtonGroup.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonGroup.types.d.ts","sourceRoot":"","sources":["../../../src/components/ButtonGroup/ButtonGroup.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,EAAE,KAAK,sBAAsB,EAAE,MAAM,iCAAiC,CAAC;AAC9E,OAAO,EAAE,KAAK,kBAAkB,EAAE,MAAM,aAAa,CAAC;AAEtD;;GAEG;AACH,MAAM,WAAW,iBAAiB;IAChC,yCAAyC;IACzC,KAAK,EAAE,MAAM,CAAC;IACd,iBAAiB;IACjB,KAAK,EAAE,MAAM,CAAC;IACd,oCAAoC;IACpC,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,sCAAsC;IACtC,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,MAAM,WAAW,gBACf,SAAQ,kBAAkB,EAAE,IAAI,CAAC,sBAAsB,EAAE,OAAO,GAAG,UAAU,GAAG,UAAU,CAAC;IAC3F,0CAA0C;IAC1C,OAAO,EAAE,iBAAiB,EAAE,CAAC;IAC7B,4CAA4C;IAC5C,cAAc,EAAE,MAAM,CAAC;IACvB,oCAAoC;IACpC,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,WAAW,CAAC,EAAE,KAAK,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;IAC5E,+BAA+B;IAC/B,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB"}

package/dist/components/ButtonGroup/index.d.ts

@@ -0,0 +1,12 @@
+import { ButtonGroupProps } from './ButtonGroup.types';
+
+export type { ButtonGroupProps, ButtonGroupOption } from './ButtonGroup.types';
+/**
+ * ButtonGroup renders a set of toggle buttons; one can be selected at a time.
+ * Use for view switchers, sort options, or filter toggles.
+ */
+export declare function ButtonGroup({ options, selectedOption, isDisabled, onChange, className, id, 'data-testid': dataTestId, ...args }: ButtonGroupProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace ButtonGroup {
+    var displayName: string;
+}
+//# sourceMappingURL=index.d.ts.map

package/dist/components/ButtonGroup/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/ButtonGroup/index.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAqB,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AAC/E,OAAO,2BAA2B,CAAC;AAEnC,YAAY,EAAE,gBAAgB,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAiC/E;;;GAGG;AACH,wBAAgB,WAAW,CAAC,EAC1B,OAAO,EACP,cAAc,EACd,UAAkB,EAClB,QAAQ,EACR,SAAc,EACd,EAAE,EACF,aAAa,EAAE,UAAU,EACzB,GAAG,IAAI,EACR,EAAE,gBAAgB,2CA6BlB;yBAtCe,WAAW"}

package/dist/components/ButtonGroup/index.js

@@ -0,0 +1,70 @@
+!function(){"use strict";try{if("undefined"!=typeof document){var t=document.createElement("style");t.appendChild(document.createTextNode(".ia-styles.ia-buttonGroup{color:#505c75;font-family:Manrope,sans-serif;font-size:14px;font-weight:500;height:32px;overflow:hidden;text-transform:none}.ia-styles.ia-buttonGroup.ia-buttonGroup-disabled{background-color:#f8f9fb;border-color:#d9dde7;color:#b4bac7}.ia-styles.ia-buttonGroupButton{background:#fff;border:1px solid #c3c8d4;border-radius:0;border-right:0;font-family:Manrope,sans-serif;margin-left:-1px;padding:0 12px;position:relative;text-transform:none;z-index:1}.ia-styles.ia-buttonGroupButton:first-child{border-bottom-left-radius:8px;border-top-left-radius:8px;margin-left:0}.ia-styles.ia-buttonGroupButton:last-child{border-bottom-right-radius:8px;border-right:1px solid #c3c8d4;border-top-right-radius:8px}.ia-styles.ia-buttonGroupButton.ia-buttonGroupButton-withIcon{display:flex;gap:2px}.ia-styles.ia-buttonGroupButton:hover{background:#fff;color:#4259ee}.ia-styles.ia-buttonGroupButton:focus{outline:none}.ia-styles.ia-buttonGroupButton.ia-buttonGroupButton-disabled{background:#f8f9fb;border-color:#d9dde7;color:#b4bac7}.ia-styles.ia-buttonGroupButton.ia-buttonGroupButton-disabled:last-child{border-right:1px solid #d9dde7}.ia-styles.ia-buttonGroupButton.ia-buttonGroupButton-selected{background:#eceefd;border:1px solid #4259ee;color:#4259ee;margin-left:-1px;position:relative;z-index:2}.ia-styles.ia-buttonGroupButton.ia-buttonGroupButton-selected:first-child{margin-left:0}.ia-styles.ia-buttonGroupButton.ia-buttonGroupButton-selected+.ia-buttonGroupButton{border-left:#0000!important}.ia-buttonGroupButton-selected.ia-buttonGroupButton,.ia-styles.ia-buttonGroupButton.ia-buttonGroupButton-selected:last-child{border-right-color:#4259ee!important}.ia-buttonGroup-disabled .ia-buttonGroupButton-selected{background:#f8f9fb!important;border-color:#d9dde7!important;color:#b4bac7!important}")),document.head.appendChild(t)}}catch(o){console.error("vite-plugin-css-injected-by-js",o)}}();
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useMemo } from "react";
+
+import ToggleButtonGroup from "../../node_modules/@mui/material/ToggleButtonGroup/ToggleButtonGroup.js";
+import ToggleButton$1 from "../../node_modules/@mui/material/ToggleButton/ToggleButton.js";
+function ToggleButton({ selfProps, parentProps }) {
+  const { icon, label, disabled: selfDisabled, onClick: _onClick, ...restSelf } = selfProps;
+  const { selectedOption, isDisabled } = parentProps;
+  const buttonClassName = useMemo(() => {
+    let retVal = "ia-styles ia-buttonGroupButton";
+    if (selfDisabled ?? isDisabled) {
+      retVal += " ia-buttonGroupButton-disabled";
+    }
+    if (selfProps.value === selectedOption) {
+      retVal += " ia-buttonGroupButton-selected";
+    }
+    if (icon) {
+      retVal += " ia-buttonGroupButton-withIcon";
+    }
+    return retVal;
+  }, [selfDisabled, isDisabled, selfProps.value, selectedOption, icon]);
+  return /* @__PURE__ */ jsxs(ToggleButton$1, { disableRipple: true, className: buttonClassName, ...restSelf, children: [
+    icon,
+    label
+  ] });
+}
+function ButtonGroup({
+  options,
+  selectedOption,
+  isDisabled = false,
+  onChange,
+  className = "",
+  id,
+  "data-testid": dataTestId,
+  ...args
+}) {
+  const groupClassName = useMemo(() => {
+    let retVal = "ia-styles ia-buttonGroup";
+    if (isDisabled) {
+      retVal += " ia-buttonGroup-disabled";
+    }
+    return `${retVal} ${className}`.trim();
+  }, [isDisabled, className]);
+  return /* @__PURE__ */ jsx(
+    ToggleButtonGroup,
+    {
+      ...args,
+      exclusive: true,
+      className: groupClassName,
+      "data-testid": dataTestId,
+      id,
+      orientation: "horizontal",
+      value: selectedOption,
+      onChange: (_e, value) => onChange == null ? void 0 : onChange(_e, value),
+      children: options.map((opt) => /* @__PURE__ */ jsx(
+        ToggleButton,
+        {
+          parentProps: { isDisabled, selectedOption },
+          selfProps: { ...opt }
+        },
+        opt.value
+      ))
+    }
+  );
+}
+ButtonGroup.displayName = "ButtonGroup";
+export {
+  ButtonGroup
+};

package/dist/components/Card/Card.types.d.ts

@@ -0,0 +1,50 @@
+import { ReactNode } from 'react';
+import { CardProps as MUICardProps } from '@mui/material/Card';
+import { BaseComponentProps } from '../../types';
+
+export type CardSize = 'extraSmall' | 'small' | 'medium' | 'large' | 'extraLarge' | 'extraLarge-3x';
+export interface CardProps extends Omit<BaseComponentProps, 'children'>, Omit<MUICardProps, 'size'> {
+    /**
+     * Card content
+     */
+    children?: ReactNode;
+    /**
+     * The size of the card which affects the box-shadow intensity
+     * @default 'medium'
+     */
+    size?: CardSize;
+    /**
+     * Custom padding for the card
+     * @default '20px'
+     */
+    padding?: string | number;
+    /**
+     * Custom width for the card
+     * @default '100%'
+     */
+    width?: string | number;
+    /**
+     * Custom maximum width for the card
+     * @default 500
+     */
+    maxWidth?: string | number;
+    /**
+     * Custom minimum height for the card
+     * @default 300
+     */
+    minHeight?: string | number;
+    /**
+     * Whether the card is clickable/interactive
+     * @default false
+     */
+    clickable?: boolean;
+    /**
+     * Click handler for the card
+     */
+    onClick?: (event: React.MouseEvent<HTMLDivElement>) => void;
+    /**
+     * Accessible label for screen readers
+     */
+    'aria-label'?: string;
+}
+//# sourceMappingURL=Card.types.d.ts.map

package/dist/components/Card/Card.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Card.types.d.ts","sourceRoot":"","sources":["../../../src/components/Card/Card.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,EAAE,KAAK,SAAS,IAAI,YAAY,EAAE,MAAM,oBAAoB,CAAC;AACpE,OAAO,EAAE,KAAK,kBAAkB,EAAE,MAAM,aAAa,CAAC;AAEtD,MAAM,MAAM,QAAQ,GAAG,YAAY,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,GAAG,YAAY,GAAG,eAAe,CAAC;AAEpG,MAAM,WAAW,SACf,SAAQ,IAAI,CAAC,kBAAkB,EAAE,UAAU,CAAC,EAAE,IAAI,CAAC,YAAY,EAAE,MAAM,CAAC;IACxE;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB;;;OAGG;IACH,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC1B;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB;;;OAGG;IACH,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC3B;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC5B;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,cAAc,CAAC,KAAK,IAAI,CAAC;IAC5D;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB"}

package/dist/components/Card/index.d.ts

@@ -0,0 +1,9 @@
+import { CardProps } from './Card.types';
+
+export type { CardProps, CardSize } from './Card.types';
+/**
+ * Card component for displaying content in a contained surface
+ * Supports multiple sizes with different shadow intensities
+ */
+export declare const Card: import('react').ForwardRefExoticComponent<Omit<CardProps, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
+//# sourceMappingURL=index.d.ts.map

package/dist/components/Card/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Card/index.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AAC9C,OAAO,oBAAoB,CAAC;AAG5B,YAAY,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AAExD;;;GAGG;AACH,eAAO,MAAM,IAAI,mHAgEhB,CAAC"}

package/dist/components/Card/index.js

@@ -0,0 +1,66 @@
+!function(){"use strict";try{if("undefined"!=typeof document){var a=document.createElement("style");a.appendChild(document.createTextNode(".ia-styles.ia-card{background-color:#fff;border:1px solid #fff;border-radius:8px}.ia-styles.ia-card:hover{border-color:#d9dde7}.ia-styles.ia-card:focus{border-color:#4259ee}.ia-styles.ia-card.ia-card-extraSmall{box-shadow:0 0 4px #0000001f}.ia-styles.ia-card.ia-card-small{box-shadow:0 8px 10px #0000000f}.ia-styles.ia-card.ia-card-medium{box-shadow:0 16px 18px #0000000f}.ia-styles.ia-card.ia-card-large{box-shadow:0 24px 26px #0000000f}.ia-styles.ia-card.ia-card-extraLarge{box-shadow:0 32px 36px #0000000f}.ia-styles.ia-card.ia-card-extraLarge-3x{box-shadow:0 64px 64px #0000000f}")),document.head.appendChild(a)}}catch(e){console.error("vite-plugin-css-injected-by-js",e)}}();
+import { jsx } from "react/jsx-runtime";
+import { forwardRef, useMemo } from "react";
+
+import Card$1 from "../../node_modules/@mui/material/Card/Card.js";
+const Card = forwardRef(
+  ({
+    children,
+    size = "medium",
+    padding = "20px",
+    width = "100%",
+    maxWidth = 500,
+    minHeight = 300,
+    clickable = false,
+    className = "",
+    onClick,
+    "aria-label": ariaLabel,
+    sx,
+    ...args
+  }, ref) => {
+    const classStr = useMemo(() => {
+      let retVal = `ia-styles ia-card ia-card-${size} ${className}`;
+      if (clickable) {
+        retVal += " ia-card-clickable";
+      }
+      return retVal.trim();
+    }, [size, className, clickable]);
+    const handleClick = (event) => {
+      if (onClick) {
+        onClick(event);
+      }
+    };
+    const handleKeyDown = (event) => {
+      if (clickable && onClick && (event.key === "Enter" || event.key === " ")) {
+        event.preventDefault();
+        onClick(event);
+      }
+    };
+    return /* @__PURE__ */ jsx(
+      Card$1,
+      {
+        ref,
+        "aria-label": ariaLabel,
+        className: classStr,
+        role: clickable ? "button" : void 0,
+        tabIndex: clickable ? 0 : void 0,
+        onClick: clickable ? handleClick : void 0,
+        onKeyDown: clickable ? handleKeyDown : void 0,
+        ...args,
+        sx: {
+          padding,
+          width,
+          maxWidth,
+          minHeight,
+          cursor: clickable ? "pointer" : "default",
+          ...sx
+        },
+        children
+      }
+    );
+  }
+);
+Card.displayName = "Card";
+export {
+  Card
+};