impact-ui 5.0.0-beta.1 → 5.0.0-beta.2

package/dist/components/TableV36/tableFunctions.js

@@ -1546,7 +1546,7 @@ const Columns = forwardRef((props, ref) => {
                   ImpactIcon,
                   {
                     icon: impactIconSource(SaveViewEditIcon_default),
-                    size: 16,
+                    size: 14,
                     style: { cursor: "pointer" },
                     onClick: (e) => {
                       handleEditView(view, e);
@@ -1557,7 +1557,7 @@ const Columns = forwardRef((props, ref) => {
                   ImpactIcon,
                   {
                     icon: impactIconSource(SaveViewDeleteIcon_default),
-                    size: 16,
+                    size: 14,
                     style: { cursor: "pointer" },
                     onClick: (e) => {
                       handleDeleteView(view, e);
@@ -1569,7 +1569,7 @@ const Columns = forwardRef((props, ref) => {
                   {
                     className: "default-view-active-icon",
                     icon: impactIconSource(DefaultViewIconActive_default),
-                    size: 16,
+                    size: 14,
                     style: { cursor: "pointer" },
                     onClick: (e) => {
                       e.stopPropagation();
@@ -1581,7 +1581,7 @@ const Columns = forwardRef((props, ref) => {
                   ImpactIcon,
                   {
                     icon: impactIconSource(DefaultViewIcon_default),
-                    size: 16,
+                    size: 14,
                     style: { cursor: "pointer" },
                     onClick: (e) => {
                       e.stopPropagation();

package/dist/components/TableV36/tableHeader.d.ts

@@ -1,5 +1,3 @@
-import { default as React } from 'react';
-
 export default function TableHeader({ actualRef, colDefs, Columns, tableFontSize, setTableFontSize, rowHeight, setRowHeight, tableHeader, topRightOptions, topLeftOptions, onGlobalSearchClick, cardContainer, onNumberFormatChange, hideRowHeightOptionMenu, showDownloadButton, onDownloadButtonClick, closeButton, handleCloseButtonClick, additionalButtons, setTableSettingOpen, showHideEditableCells, handleShowHideEditableCells, topCenterOptions, showContentualFilter, showContentualFilterBadge, onContentualFilterClick, contentualFilterProps, contentualFilterComponent, tableActions, onTableActionsTabClick, hideTableFormat, hideTableActions, hideTableSetting, explicitlyCloseTableSetting, customSystemButton, isChatEnabled, handleChatClick, isChatOpen, handleChatClose, chatConfiguration, savedViewsOptions, handleSaveAndApply, maxSavedViews, handleSavedViewClick, handleEditSaveView, isSaveViewEnabled, isSavingViewLoading, handleDeleteViewClick, isDeleteViewLoading, handleSetDefaultView, isCommentFeatureEnabled, showCommentBadge, toggleCommentMode, commentMode, hideFontSize, hideNumericFormat, onContentDensityChange, isCommentResolvedAlertOpen, setIsCommentResolvedAlertOpen, showCommentPanel, setShowCommentPanel, customTabInTableSettings, closeTableSettingOnOutsideClick, saveViewCustomFilter, customRenderSaveViewContent, onTableSettingClick, deleteViewPromptText, isViewNameUniqueAcrossTypes, contentualFilterOpenByDefault, tableSettingsTitle, registerTableSettingToggle, numericFormatDefault, extraNumericFormatOptions, viewPoint, disableContextualFilter, disableTableSettings, onAdvanceSortClick, advanceSortEnabled, }: {
     actualRef: any;
     colDefs: any;
@@ -79,5 +77,5 @@ export default function TableHeader({ actualRef, colDefs, Columns, tableFontSize
     disableTableSettings: any;
     onAdvanceSortClick: any;
     advanceSortEnabled: any;
-}): React.JSX.Element | null;
+}): import("react").JSX.Element | null;
 //# sourceMappingURL=tableHeader.d.ts.map

package/dist/components/TableV36/tableHeader.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tableHeader.d.ts","sourceRoot":"","sources":["../../../src/components/TableV36/tableHeader.tsx"],"names":[],"mappings":"AACA,OAAO,KAA+D,MAAM,OAAO,CAAC;AAkBpF,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,EAClC,SAAS,EACT,OAAO,EACP,OAAO,EACP,aAAa,EACb,gBAAgB,EAChB,SAAS,EACT,YAAY,EACZ,WAAW,EACX,eAAe,EACf,cAAc,EACd,mBAAmB,EACnB,aAAa,EACb,oBAAoB,EACpB,uBAAuB,EACvB,kBAAkB,EAClB,qBAAqB,EACrB,WAAW,EACX,sBAAsB,EACtB,iBAAiB,EACjB,mBAAmB,EACnB,qBAAqB,EACrB,2BAA2B,EAC3B,gBAAgB,EAChB,oBAAoB,EACpB,yBAAyB,EACzB,uBAAuB,EACvB,qBAA0B,EAC1B,yBAAyB,EACzB,YAAY,EACZ,sBAAsB,EACtB,eAAe,EACf,gBAAgB,EAChB,gBAAgB,EAChB,2BAA2B,EAC3B,kBAAkB,EAClB,aAAoB,EACpB,eAA0B,EAC1B,UAAU,EACV,eAAe,EACf,iBAAiB,EACjB,iBAAiB,EACjB,kBAAkB,EAClB,aAAa,EACb,oBAAoB,EACpB,kBAAkB,EAClB,iBAAiB,EACjB,mBAAmB,EACnB,qBAAqB,EACrB,mBAAmB,EACnB,oBAAoB,EACpB,uBAAuB,EACvB,gBAAgB,EAChB,iBAAiB,EACjB,WAAW,EACX,YAAY,EACZ,iBAAiB,EACjB,sBAAsB,EACtB,0BAA0B,EAC1B,6BAA6B,EAC7B,gBAAgB,EAChB,mBAAmB,EACnB,wBAAwB,EACxB,+BAA+B,EAC/B,oBAAoB,EACpB,2BAA2B,EAC3B,mBAAmB,EACnB,oBAAoB,EACpB,2BAA2B,EAC3B,6BAA6B,EAC7B,kBAAkB,EAClB,0BAA0B,EAC1B,oBAAoB,EACpB,yBAAyB,EACzB,SAAS,EACT,uBAAuB,EACvB,oBAAoB,EACpB,kBAAkB,EAClB,kBAAkB,GACnB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAAA,4BAsWA"}
+{"version":3,"file":"tableHeader.d.ts","sourceRoot":"","sources":["../../../src/components/TableV36/tableHeader.tsx"],"names":[],"mappings":"AAeA,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,EAClC,SAAS,EACT,OAAO,EACP,OAAO,EACP,aAAa,EACb,gBAAgB,EAChB,SAAS,EACT,YAAY,EACZ,WAAW,EACX,eAAe,EACf,cAAc,EACd,mBAAmB,EACnB,aAAa,EACb,oBAAoB,EACpB,uBAAuB,EACvB,kBAAkB,EAClB,qBAAqB,EACrB,WAAW,EACX,sBAAsB,EACtB,iBAAiB,EACjB,mBAAmB,EACnB,qBAAqB,EACrB,2BAA2B,EAC3B,gBAAgB,EAChB,oBAAoB,EACpB,yBAAyB,EACzB,uBAAuB,EACvB,qBAA0B,EAC1B,yBAAyB,EACzB,YAAY,EACZ,sBAAsB,EACtB,eAAe,EACf,gBAAgB,EAChB,gBAAgB,EAChB,2BAA2B,EAC3B,kBAAkB,EAClB,aAAoB,EACpB,eAA0B,EAC1B,UAAU,EACV,eAAe,EACf,iBAAiB,EACjB,iBAAiB,EACjB,kBAAkB,EAClB,aAAa,EACb,oBAAoB,EACpB,kBAAkB,EAClB,iBAAiB,EACjB,mBAAmB,EACnB,qBAAqB,EACrB,mBAAmB,EACnB,oBAAoB,EACpB,uBAAuB,EACvB,gBAAgB,EAChB,iBAAiB,EACjB,WAAW,EACX,YAAY,EACZ,iBAAiB,EACjB,sBAAsB,EACtB,0BAA0B,EAC1B,6BAA6B,EAC7B,gBAAgB,EAChB,mBAAmB,EACnB,wBAAwB,EACxB,+BAA+B,EAC/B,oBAAoB,EACpB,2BAA2B,EAC3B,mBAAmB,EACnB,oBAAoB,EACpB,2BAA2B,EAC3B,6BAA6B,EAC7B,kBAAkB,EAClB,0BAA0B,EAC1B,oBAAoB,EACpB,yBAAyB,EACzB,SAAS,EACT,uBAAuB,EACvB,oBAAoB,EACpB,kBAAkB,EAClB,kBAAkB,GACnB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAAA,sCAuWA"}

package/dist/components/TableV36/tableHeader.js

@@ -1,6 +1,6 @@
 import { jsxs, jsx, Fragment } from "react/jsx-runtime";
 import { useState, useRef, useEffect, useMemo } from "react";
-import { ChatIcon as ChatIcon_default } from "../../node_modules/@impactsmartsuite/impact-icons/dist/index.js";
+import { CommentGray as CommentGray_default } from "../../node_modules/@impactsmartsuite/impact-icons/dist/index.js";
 import default_1 from "../../node_modules/@mui/icons-material/FilterAltOffOutlined.js";
 import default_1$1 from "../../node_modules/@mui/icons-material/FilterAltOutlined.js";
 import default_1$2 from "../../node_modules/@mui/icons-material/MoreHorizOutlined.js";
@@ -262,7 +262,7 @@ function TableHeader({
                     className: "table-chat-icon-button",
                     "data-icon": "chat",
                     "data-type": "table-icon",
-                    icon: /* @__PURE__ */ jsx(ImpactIcon, { icon: impactIconSource(ChatIcon_default), size: 16 }),
+                    icon: /* @__PURE__ */ jsx(ImpactIcon, { icon: impactIconSource(CommentGray_default), size: 16 }),
                     variant: "tertiary",
                     onClick: handleChatClick
                   }
@@ -286,6 +286,7 @@ function TableHeader({
                 "data-active": commentMode ? "true" : void 0,
                 "data-icon": "comment",
                 "data-type": "table-icon",
+                icon: /* @__PURE__ */ jsx(ImpactIcon, { icon: impactIconSource(CommentGray_default), size: 16 }),
                 variant: "text",
                 onClick: handleCommentClick
               }

package/dist/components/TableV36/tablePagination.js

@@ -17,7 +17,7 @@ function TablePagination({
   const onPageSizeChange = (val) => {
     var _a, _b;
     setLocalPageSize(val);
-    (_b = (_a = actualRef == null ? void 0 : actualRef.current) == null ? void 0 : _a.api) == null ? void 0 : _b.paginationSetPageSize(val);
+    (_b = (_a = actualRef == null ? void 0 : actualRef.current) == null ? void 0 : _a.api) == null ? void 0 : _b.setGridOption("paginationPageSize", val);
     setPaginationOptionsAnchorEl(null);
   };
   return /* @__PURE__ */ jsxs("div", { className: "pagination-container", children: [

package/dist/components/TableV36/tableSettings.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tableSettings.d.ts","sourceRoot":"","sources":["../../../src/components/TableV36/tableSettings.tsx"],"names":[],"mappings":"AACA,OAAO,KAA4D,MAAM,OAAO,CAAC;AAOjF,MAAM,CAAC,OAAO,UAAU,aAAa,CAAC,EACpC,QAAQ,EACR,OAAO,EACP,SAAS,EACT,aAAa,EACb,gBAAgB,EAChB,eAAe,EACf,oBAAoB,EACpB,OAAO,EACP,WAAW,EACX,gBAAgB,EAChB,mBAAmB,EACnB,mBAAmB,EACnB,YAAY,EACZ,sBAAsB,EACtB,eAAe,EACf,eAAe,EACf,gBAAgB,EAChB,iBAAiB,EACjB,kBAAkB,EAClB,aAAa,EACb,oBAAoB,EACpB,kBAAkB,EAClB,iBAAiB,EACjB,mBAAmB,EACnB,qBAAqB,EACrB,mBAAmB,EACnB,oBAAoB,EACpB,iBAAiB,EACjB,YAAY,EACZ,wBAAwB,EACxB,oBAAoB,EACpB,2BAA2B,EAC3B,mBAAmB,EACnB,oBAAoB,EACpB,2BAA2B,EAC3B,kBAAqC,EACrC,0BAA0B,EAC1B,oBAAoB,EACpB,yBAAyB,GAC1B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAAA,qBA6NA"}
+{"version":3,"file":"tableSettings.d.ts","sourceRoot":"","sources":["../../../src/components/TableV36/tableSettings.tsx"],"names":[],"mappings":"AACA,OAAO,KAA4D,MAAM,OAAO,CAAC;AAUjF,MAAM,CAAC,OAAO,UAAU,aAAa,CAAC,EACpC,QAAQ,EACR,OAAO,EACP,SAAS,EACT,aAAa,EACb,gBAAgB,EAChB,eAAe,EACf,oBAAoB,EACpB,OAAO,EACP,WAAW,EACX,gBAAgB,EAChB,mBAAmB,EACnB,mBAAmB,EACnB,YAAY,EACZ,sBAAsB,EACtB,eAAe,EACf,eAAe,EACf,gBAAgB,EAChB,iBAAiB,EACjB,kBAAkB,EAClB,aAAa,EACb,oBAAoB,EACpB,kBAAkB,EAClB,iBAAiB,EACjB,mBAAmB,EACnB,qBAAqB,EACrB,mBAAmB,EACnB,oBAAoB,EACpB,iBAAiB,EACjB,YAAY,EACZ,wBAAwB,EACxB,oBAAoB,EACpB,2BAA2B,EAC3B,mBAAmB,EACnB,oBAAoB,EACpB,2BAA2B,EAC3B,kBAAqC,EACrC,0BAA0B,EAC1B,oBAAoB,EACpB,yBAAyB,GAC1B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAAA,qBA0NA"}

package/dist/components/TableV36/tableSettings.js

@@ -1,10 +1,13 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import React__default, { useState, useRef, useCallback, useEffect, useMemo } from "react";
+import { Close as Close_default } from "../../node_modules/@impactsmartsuite/impact-icons/dist/index.js";
 import default_1$2 from "../../node_modules/@mui/icons-material/AutoFixHigh.js";
 import default_1$1 from "../../node_modules/@mui/icons-material/FormatColorTextOutlined.js";
 import default_1 from "../../node_modules/@mui/icons-material/ViewColumnOutlined.js";
+import { ImpactIcon, impactIconSource } from "../ImpactIcon/index.js";
 import { RadioButtonGroup } from "../RadioButtonGroup/index.js";
 import { Tabs } from "../Tabs/index.js";
+import { useTranslation } from "../../i18n/useTranslation.js";
 function TableSettings({
   showMenu,
   Columns,
@@ -46,6 +49,7 @@ function TableSettings({
   numericFormatDefault,
   extraNumericFormatOptions
 }) {
+  const { t } = useTranslation();
   const [selectedMenuTab, setSelectedMenuTab] = useState("Columns");
   const [numericFormat, setNumericFormat] = useState(numericFormatDefault || "full_no");
   const showTableSettingRef = useRef(showTableSetting);
@@ -227,18 +231,13 @@ function TableSettings({
         /* @__PURE__ */ jsxs("div", { className: "table-setting-header", children: [
           /* @__PURE__ */ jsx("h2", { children: tableSettingsTitle }),
           /* @__PURE__ */ jsx(
-            "span",
+            "button",
             {
+              "aria-label": t("common.close"),
               className: "close_icon",
-              role: "button",
-              tabIndex: 0,
+              type: "button",
               onClick: onCloseTableSetting,
-              onKeyDown: (e) => {
-                if (e.key === "Enter" || e.key === " ") {
-                  e.preventDefault();
-                  onCloseTableSetting();
-                }
-              }
+              children: /* @__PURE__ */ jsx(ImpactIcon, { icon: impactIconSource(Close_default), size: 12 })
             }
           )
         ] }),

package/dist/components/ThemingPanel/AccentColorSection.d.ts

@@ -0,0 +1,11 @@
+import { AccentColorId } from './ThemingPanel.types';
+
+export interface AccentColorSectionProps {
+    value: AccentColorId;
+    onChange: (color: AccentColorId) => void;
+}
+export declare function AccentColorSection({ value, onChange }: AccentColorSectionProps): import("react").JSX.Element;
+export declare namespace AccentColorSection {
+    var displayName: string;
+}
+//# sourceMappingURL=AccentColorSection.d.ts.map

package/dist/components/ThemingPanel/AccentColorSection.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AccentColorSection.d.ts","sourceRoot":"","sources":["../../../src/components/ThemingPanel/AccentColorSection.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,sBAAsB,CAAC;AAE1D,MAAM,WAAW,uBAAuB;IACtC,KAAK,EAAE,aAAa,CAAC;IACrB,QAAQ,EAAE,CAAC,KAAK,EAAE,aAAa,KAAK,IAAI,CAAC;CAC1C;AAED,wBAAgB,kBAAkB,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,uBAAuB,+BAuC9E;yBAvCe,kBAAkB"}

package/dist/components/ThemingPanel/AccentColorSection.js

@@ -0,0 +1,43 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { ACCENT_COLORS, getAccentColorCssVar } from "./themingPanel.constants.js";
+import { useTranslation } from "../../i18n/useTranslation.js";
+function AccentColorSection({ value, onChange }) {
+  const { t } = useTranslation();
+  return /* @__PURE__ */ jsxs("section", { className: "ia-theming-panel-row", children: [
+    /* @__PURE__ */ jsxs("div", { className: "ia-theming-panel-row-copy", children: [
+      /* @__PURE__ */ jsx("h3", { className: "ia-theming-panel-section-title", children: t("themingPanel.accentColor.title") }),
+      /* @__PURE__ */ jsx("p", { className: "ia-theming-panel-section-subtitle", children: t("themingPanel.accentColor.subtitle") })
+    ] }),
+    /* @__PURE__ */ jsx(
+      "div",
+      {
+        "aria-label": t("themingPanel.accentColor.title"),
+        className: "ia-theming-panel-swatches",
+        role: "radiogroup",
+        children: ACCENT_COLORS.map(({ id }) => {
+          const selected = value === id;
+          return /* @__PURE__ */ jsx(
+            "button",
+            {
+              "aria-checked": selected,
+              "aria-label": t(`themingPanel.accentColor.${id}`),
+              className: `ia-theming-panel-swatch ${selected ? "ia-theming-panel-swatch-selected" : ""}`,
+              role: "radio",
+              style: { "--ia-theming-swatch-color": getAccentColorCssVar(id) },
+              type: "button",
+              onClick: () => {
+                onChange(id);
+              },
+              children: /* @__PURE__ */ jsx("span", { className: "ia-theming-panel-swatch-fill" })
+            },
+            id
+          );
+        })
+      }
+    )
+  ] });
+}
+AccentColorSection.displayName = "AccentColorSection";
+export {
+  AccentColorSection
+};

package/dist/components/ThemingPanel/EnhanceContrastSection.d.ts

@@ -0,0 +1,11 @@
+import { ContrastLevel } from './ThemingPanel.types';
+
+export interface EnhanceContrastSectionProps {
+    value: ContrastLevel;
+    onChange: (level: ContrastLevel) => void;
+}
+export declare function EnhanceContrastSection({ value, onChange }: EnhanceContrastSectionProps): import("react").JSX.Element;
+export declare namespace EnhanceContrastSection {
+    var displayName: string;
+}
+//# sourceMappingURL=EnhanceContrastSection.d.ts.map

package/dist/components/ThemingPanel/EnhanceContrastSection.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"EnhanceContrastSection.d.ts","sourceRoot":"","sources":["../../../src/components/ThemingPanel/EnhanceContrastSection.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,sBAAsB,CAAC;AAE1D,MAAM,WAAW,2BAA2B;IAC1C,KAAK,EAAE,aAAa,CAAC;IACrB,QAAQ,EAAE,CAAC,KAAK,EAAE,aAAa,KAAK,IAAI,CAAC;CAC1C;AAED,wBAAgB,sBAAsB,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,2BAA2B,+BAmCtF;yBAnCe,sBAAsB"}

package/dist/components/ThemingPanel/EnhanceContrastSection.js

@@ -0,0 +1,42 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { Chips } from "../Chips/index.js";
+import { CONTRAST_LEVELS } from "./themingPanel.constants.js";
+import { useTranslation } from "../../i18n/useTranslation.js";
+function EnhanceContrastSection({ value, onChange }) {
+  const { t } = useTranslation();
+  const labels = {
+    subtle: t("themingPanel.contrast.subtle"),
+    default: t("themingPanel.contrast.default"),
+    dark: t("themingPanel.contrast.dark")
+  };
+  return /* @__PURE__ */ jsxs("section", { className: "ia-theming-panel-row", children: [
+    /* @__PURE__ */ jsxs("div", { className: "ia-theming-panel-row-copy", children: [
+      /* @__PURE__ */ jsx("h3", { className: "ia-theming-panel-section-title", children: t("themingPanel.contrast.title") }),
+      /* @__PURE__ */ jsx("p", { className: "ia-theming-panel-section-subtitle", children: t("themingPanel.contrast.subtitle") })
+    ] }),
+    /* @__PURE__ */ jsx(
+      "div",
+      {
+        "aria-label": t("themingPanel.contrast.title"),
+        className: "ia-theming-panel-chips",
+        role: "radiogroup",
+        children: CONTRAST_LEVELS.map((level) => /* @__PURE__ */ jsx(
+          Chips,
+          {
+            isActive: value === level,
+            label: labels[level],
+            type: "default",
+            onClick: () => {
+              onChange(level);
+            }
+          },
+          level
+        ))
+      }
+    )
+  ] });
+}
+EnhanceContrastSection.displayName = "EnhanceContrastSection";
+export {
+  EnhanceContrastSection
+};

package/dist/components/ThemingPanel/InterfaceThemeSection.d.ts

@@ -0,0 +1,13 @@
+import { ImpactUiThemeMode } from '../../tokens';
+
+export interface InterfaceThemeSectionProps {
+    /** Theme preference from the parent (e.g. `useImpactUiTheme().mode` or panel draft state). */
+    value: ImpactUiThemeMode;
+    /** Called when the user picks System / Light / Dark (wire to `setMode` or draft handler). */
+    onChange: (mode: ImpactUiThemeMode) => void;
+}
+export declare function InterfaceThemeSection({ value, onChange }: InterfaceThemeSectionProps): import("react").JSX.Element;
+export declare namespace InterfaceThemeSection {
+    var displayName: string;
+}
+//# sourceMappingURL=InterfaceThemeSection.d.ts.map

package/dist/components/ThemingPanel/InterfaceThemeSection.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"InterfaceThemeSection.d.ts","sourceRoot":"","sources":["../../../src/components/ThemingPanel/InterfaceThemeSection.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,cAAc,CAAC;AAEtD,MAAM,WAAW,0BAA0B;IACzC,8FAA8F;IAC9F,KAAK,EAAE,iBAAiB,CAAC;IACzB,6FAA6F;IAC7F,QAAQ,EAAE,CAAC,IAAI,EAAE,iBAAiB,KAAK,IAAI,CAAC;CAC7C;AAiED,wBAAgB,qBAAqB,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,0BAA0B,+BA6DpF;yBA7De,qBAAqB"}

package/dist/components/ThemingPanel/InterfaceThemeSection.js

@@ -0,0 +1,118 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { useTranslation } from "../../i18n/useTranslation.js";
+import Radio from "../../node_modules/@mui/material/Radio/Radio.js";
+const MODES = ["system", "light", "dark"];
+function WindowDots({ variant }) {
+  if (variant === "dark") {
+    return /* @__PURE__ */ jsxs("div", { "aria-hidden": true, className: "ia-theming-panel-preview-chrome", children: [
+      /* @__PURE__ */ jsx("span", { className: "ia-theming-panel-preview-dots ia-theming-panel-preview-dots--dark" }),
+      /* @__PURE__ */ jsx("span", { className: "ia-theming-panel-preview-accent" })
+    ] });
+  }
+  return /* @__PURE__ */ jsxs("div", { "aria-hidden": true, className: "ia-theming-panel-preview-chrome", children: [
+    /* @__PURE__ */ jsx("span", { className: "ia-theming-panel-preview-dot ia-theming-panel-preview-dot--red" }),
+    /* @__PURE__ */ jsx("span", { className: "ia-theming-panel-preview-dot ia-theming-panel-preview-dot--amber" }),
+    /* @__PURE__ */ jsx("span", { className: "ia-theming-panel-preview-dot ia-theming-panel-preview-dot--green" }),
+    /* @__PURE__ */ jsx("span", { className: "ia-theming-panel-preview-accent" })
+  ] });
+}
+function MockEditor({ tone }) {
+  return /* @__PURE__ */ jsxs("div", { className: `ia-theming-panel-preview-editor ia-theming-panel-preview-editor--${tone}`, children: [
+    /* @__PURE__ */ jsx("div", { className: "ia-theming-panel-preview-sidebar" }),
+    /* @__PURE__ */ jsxs("div", { className: "ia-theming-panel-preview-main", children: [
+      /* @__PURE__ */ jsx("div", { className: "ia-theming-panel-preview-navbar" }),
+      /* @__PURE__ */ jsx("div", { className: "ia-theming-panel-preview-body" })
+    ] })
+  ] });
+}
+function ThemePreview({ mode }) {
+  if (mode === "system") {
+    return /* @__PURE__ */ jsxs("div", { className: "ia-theming-panel-theme-preview ia-theming-panel-theme-preview--system", children: [
+      /* @__PURE__ */ jsxs("div", { className: "ia-theming-panel-theme-preview-half ia-theming-panel-theme-preview-half--light", children: [
+        /* @__PURE__ */ jsx(WindowDots, { variant: "system-light" }),
+        /* @__PURE__ */ jsx(MockEditor, { tone: "light" })
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "ia-theming-panel-theme-preview-half ia-theming-panel-theme-preview-half--dark", children: [
+        /* @__PURE__ */ jsx(
+          "div",
+          {
+            "aria-hidden": true,
+            className: "ia-theming-panel-preview-chrome ia-theming-panel-preview-chrome--end",
+            children: /* @__PURE__ */ jsx("span", { className: "ia-theming-panel-preview-accent" })
+          }
+        ),
+        /* @__PURE__ */ jsx(MockEditor, { tone: "dark" })
+      ] })
+    ] });
+  }
+  return /* @__PURE__ */ jsxs("div", { className: `ia-theming-panel-theme-preview ia-theming-panel-theme-preview--${mode}`, children: [
+    /* @__PURE__ */ jsx(WindowDots, { variant: mode }),
+    /* @__PURE__ */ jsx(MockEditor, { tone: mode })
+  ] });
+}
+function InterfaceThemeSection({ value, onChange }) {
+  const { t } = useTranslation();
+  const labels = {
+    light: t("profileMenu.themeLight"),
+    dark: t("profileMenu.themeDark"),
+    system: t("themingPanel.theme.system")
+  };
+  return /* @__PURE__ */ jsxs("section", { className: "ia-theming-panel-row", children: [
+    /* @__PURE__ */ jsxs("div", { className: "ia-theming-panel-row-copy", children: [
+      /* @__PURE__ */ jsx("h3", { className: "ia-theming-panel-section-title", children: t("themingPanel.interfaceTheme.title") }),
+      /* @__PURE__ */ jsx("p", { className: "ia-theming-panel-section-subtitle", children: t("themingPanel.interfaceTheme.subtitle") })
+    ] }),
+    /* @__PURE__ */ jsx(
+      "div",
+      {
+        "aria-label": t("themingPanel.interfaceTheme.title"),
+        className: "ia-theming-panel-theme-cards",
+        role: "radiogroup",
+        children: MODES.map((themeOption) => {
+          const selected = value === themeOption;
+          return /* @__PURE__ */ jsxs(
+            "div",
+            {
+              "aria-checked": selected,
+              className: `ia-theming-panel-theme-card ${selected ? "ia-theming-panel-theme-card-selected" : ""}`,
+              role: "radio",
+              tabIndex: 0,
+              onClick: () => {
+                onChange(themeOption);
+              },
+              onKeyDown: (e) => {
+                if (e.key === "Enter" || e.key === " ") {
+                  e.preventDefault();
+                  onChange(themeOption);
+                }
+              },
+              children: [
+                /* @__PURE__ */ jsx(ThemePreview, { mode: themeOption }),
+                /* @__PURE__ */ jsxs("div", { className: "ia-theming-panel-theme-card-footer", children: [
+                  /* @__PURE__ */ jsx("span", { className: "ia-theming-panel-theme-card-label", children: labels[themeOption] }),
+                  /* @__PURE__ */ jsx(
+                    Radio,
+                    {
+                      disableRipple: true,
+                      checked: selected,
+                      className: "ia-styles ia-radioButton ia-theming-panel-theme-card-radio",
+                      inputProps: { "aria-hidden": true },
+                      size: "small",
+                      tabIndex: -1,
+                      value: themeOption
+                    }
+                  )
+                ] })
+              ]
+            },
+            themeOption
+          );
+        })
+      }
+    )
+  ] });
+}
+InterfaceThemeSection.displayName = "InterfaceThemeSection";
+export {
+  InterfaceThemeSection
+};

package/dist/components/ThemingPanel/StylesSection.d.ts

@@ -0,0 +1,11 @@
+import { InterfaceStyleId } from './ThemingPanel.types';
+
+export interface StylesSectionProps {
+    value: InterfaceStyleId;
+    onChange: (style: InterfaceStyleId) => void;
+}
+export declare function StylesSection({ value, onChange }: StylesSectionProps): import("react").JSX.Element;
+export declare namespace StylesSection {
+    var displayName: string;
+}
+//# sourceMappingURL=StylesSection.d.ts.map

package/dist/components/ThemingPanel/StylesSection.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"StylesSection.d.ts","sourceRoot":"","sources":["../../../src/components/ThemingPanel/StylesSection.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AAE7D,MAAM,WAAW,kBAAkB;IACjC,KAAK,EAAE,gBAAgB,CAAC;IACxB,QAAQ,EAAE,CAAC,KAAK,EAAE,gBAAgB,KAAK,IAAI,CAAC;CAC7C;AAED,wBAAgB,aAAa,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,kBAAkB,+BA0CpE;yBA1Ce,aAAa"}

package/dist/components/ThemingPanel/StylesSection.js

@@ -0,0 +1,43 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { INTERFACE_STYLES } from "./themingPanel.constants.js";
+import { useTranslation } from "../../i18n/useTranslation.js";
+function StylesSection({ value, onChange }) {
+  const { t } = useTranslation();
+  return /* @__PURE__ */ jsxs("section", { className: "ia-theming-panel-row", children: [
+    /* @__PURE__ */ jsxs("div", { className: "ia-theming-panel-row-copy", children: [
+      /* @__PURE__ */ jsx("h3", { className: "ia-theming-panel-section-title", children: t("themingPanel.styles.title") }),
+      /* @__PURE__ */ jsx("p", { className: "ia-theming-panel-section-subtitle", children: t("themingPanel.styles.subtitle") })
+    ] }),
+    /* @__PURE__ */ jsx(
+      "div",
+      {
+        "aria-label": t("themingPanel.styles.title"),
+        className: "ia-theming-panel-styles",
+        role: "radiogroup",
+        children: INTERFACE_STYLES.map(({ id, image }) => {
+          const selected = value === id;
+          const label = t(`themingPanel.styles.${id}`);
+          return /* @__PURE__ */ jsx(
+            "button",
+            {
+              "aria-checked": selected,
+              "aria-label": label,
+              className: `ia-theming-panel-style-card ${selected ? "ia-theming-panel-style-card-selected" : ""}`,
+              role: "radio",
+              type: "button",
+              onClick: () => {
+                onChange(id);
+              },
+              children: image ? /* @__PURE__ */ jsx("img", { alt: "", className: "ia-theming-panel-style-image", src: image }) : /* @__PURE__ */ jsx("span", { className: "ia-theming-panel-style-none-label", children: label })
+            },
+            id
+          );
+        })
+      }
+    )
+  ] });
+}
+StylesSection.displayName = "StylesSection";
+export {
+  StylesSection
+};

package/dist/components/ThemingPanel/ThemesTab.d.ts

@@ -0,0 +1,18 @@
+import { AccentColorId, ContrastLevel, InterfaceStyleId } from './ThemingPanel.types';
+import { ImpactUiThemeMode } from '../../tokens';
+
+export interface ThemesTabProps {
+    mode: ImpactUiThemeMode;
+    accentColor: AccentColorId;
+    contrast: ContrastLevel;
+    style: InterfaceStyleId;
+    onModeChange: (mode: ImpactUiThemeMode) => void;
+    onAccentColorChange: (color: AccentColorId) => void;
+    onContrastChange: (level: ContrastLevel) => void;
+    onStyleChange: (style: InterfaceStyleId) => void;
+}
+export declare function ThemesTab({ mode, accentColor, contrast, style, onModeChange, onAccentColorChange, onContrastChange, onStyleChange, }: ThemesTabProps): import("react").JSX.Element;
+export declare namespace ThemesTab {
+    var displayName: string;
+}
+//# sourceMappingURL=ThemesTab.d.ts.map

package/dist/components/ThemingPanel/ThemesTab.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ThemesTab.d.ts","sourceRoot":"","sources":["../../../src/components/ThemingPanel/ThemesTab.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,aAAa,EAAE,aAAa,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AAC3F,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,cAAc,CAAC;AAEtD,MAAM,WAAW,cAAc;IAC7B,IAAI,EAAE,iBAAiB,CAAC;IACxB,WAAW,EAAE,aAAa,CAAC;IAC3B,QAAQ,EAAE,aAAa,CAAC;IACxB,KAAK,EAAE,gBAAgB,CAAC;IACxB,YAAY,EAAE,CAAC,IAAI,EAAE,iBAAiB,KAAK,IAAI,CAAC;IAChD,mBAAmB,EAAE,CAAC,KAAK,EAAE,aAAa,KAAK,IAAI,CAAC;IACpD,gBAAgB,EAAE,CAAC,KAAK,EAAE,aAAa,KAAK,IAAI,CAAC;IACjD,aAAa,EAAE,CAAC,KAAK,EAAE,gBAAgB,KAAK,IAAI,CAAC;CAClD;AAED,wBAAgB,SAAS,CAAC,EACxB,IAAI,EACJ,WAAW,EACX,QAAQ,EACR,KAAK,EACL,YAAY,EACZ,mBAAmB,EACnB,gBAAgB,EAChB,aAAa,GACd,EAAE,cAAc,+BAgBhB;yBAzBe,SAAS"}

package/dist/components/ThemingPanel/ThemesTab.js

@@ -0,0 +1,33 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { AccentColorSection } from "./AccentColorSection.js";
+import { EnhanceContrastSection } from "./EnhanceContrastSection.js";
+import { InterfaceThemeSection } from "./InterfaceThemeSection.js";
+import { StylesSection } from "./StylesSection.js";
+import { getAccentColorCssVar } from "./themingPanel.constants.js";
+function ThemesTab({
+  mode,
+  accentColor,
+  contrast,
+  style,
+  onModeChange,
+  onAccentColorChange,
+  onContrastChange,
+  onStyleChange
+}) {
+  const previewAccentStyle = {
+    "--ia-theming-preview-accent": getAccentColorCssVar(accentColor)
+  };
+  return /* @__PURE__ */ jsxs("div", { className: "ia-theming-panel-themes", style: previewAccentStyle, children: [
+    /* @__PURE__ */ jsx(InterfaceThemeSection, { value: mode, onChange: onModeChange }),
+    /* @__PURE__ */ jsx("div", { "aria-hidden": true, className: "ia-theming-panel-divider" }),
+    /* @__PURE__ */ jsx(AccentColorSection, { value: accentColor, onChange: onAccentColorChange }),
+    /* @__PURE__ */ jsx("div", { "aria-hidden": true, className: "ia-theming-panel-divider" }),
+    /* @__PURE__ */ jsx(EnhanceContrastSection, { value: contrast, onChange: onContrastChange }),
+    /* @__PURE__ */ jsx("div", { "aria-hidden": true, className: "ia-theming-panel-divider" }),
+    /* @__PURE__ */ jsx(StylesSection, { value: style, onChange: onStyleChange })
+  ] });
+}
+ThemesTab.displayName = "ThemesTab";
+export {
+  ThemesTab
+};

package/dist/components/ThemingPanel/ThemingPanel.d.ts

@@ -0,0 +1,10 @@
+import { ThemingPanelProps } from './ThemingPanel.types';
+
+/**
+ * Appearance settings modal — opened from Profile menu → Themes.
+ */
+export declare function ThemingPanel({ open, onClose, onApply, className, 'data-testid': dataTestId, }: ThemingPanelProps): import("react").JSX.Element | null;
+export declare namespace ThemingPanel {
+    var displayName: string;
+}
+//# sourceMappingURL=ThemingPanel.d.ts.map

package/dist/components/ThemingPanel/ThemingPanel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ThemingPanel.d.ts","sourceRoot":"","sources":["../../../src/components/ThemingPanel/ThemingPanel.tsx"],"names":[],"mappings":"AAkBA,OAAO,KAAK,EAIV,iBAAiB,EAClB,MAAM,sBAAsB,CAAC;AAC9B,OAAO,4BAA4B,CAAC;AAQpC;;GAEG;AACH,wBAAgB,YAAY,CAAC,EAC3B,IAAI,EACJ,OAAO,EACP,OAAO,EACP,SAAS,EACT,aAAa,EAAE,UAAU,GAC1B,EAAE,iBAAiB,sCAwKnB;yBA9Ke,YAAY"}