@gooddata/sdk-ui-kit 11.55.0-alpha.1 → 11.55.0-alpha.3

package/esm/@ui/@types/icon.d.ts

@@ -1,5 +1,5 @@
 /**
  * @internal
  */
-export type IconType = "aiAgent" | "aiAgentDisabled" | "brain" | "brainDisabled" | "check" | "checkCircle" | "certification" | "plus" | "plusCircle" | "sync" | "alert" | "alertPaused" | "close" | "cross" | "edit" | "crossCircle" | "question" | "chevronUp" | "chevronRight" | "chevronDown" | "chevronLeft" | "date" | "navigateUp" | "navigateDown" | "navigateRight" | "navigateLeft" | "download" | "slack" | "expand" | "exclamationCircle" | "infoCircle" | "book" | "visible" | "invisible" | "lock" | "unlock" | "ai" | "aiFill" | "drawer" | "drawerEmpty" | "prohibited" | "dropDown" | "dropRight" | "clock" | "clockPaused" | "questionMark" | "upload" | "expandRectangle" | "file" | "number" | "code" | "user" | "userPlus" | "users" | "magic" | "tab" | "pauseCircle" | "filter" | "timer" | "mail" | "envelope" | "copy" | "rain" | "earth" | "geoCollection" | "geoCollectionUpload" | "minimize" | "shrink" | "copyright" | "ellipsis" | "pencil" | "folder" | "folderSmall" | "folderPlus" | "trash" | "arrowUp" | "arrowRight" | "arrowDown" | "arrowLeft" | "undo" | "redo" | "trendDown" | "trendUp" | "save" | "minus" | "minusCircle" | "percent" | "enter" | "enterRight" | "money" | "ghost" | "warning" | "home" | "settings" | "search" | "university" | "building" | "printer" | "picture" | "visualization" | "dashboard" | "metric" | "fact" | "ldmAttribute" | "ldmKey" | "ldmLabel" | "sharp" | "attribute" | "horn" | "cw" | "ccw" | "table" | "directionColumn" | "directionRow" | "header" | "genai" | "genai2" | "explainai" | "hiddenForAi" | "box" | "ellipsisVertical" | "list" | "drillTo" | "hierarchy" | "history" | "history2" | "thumbsUp" | "thumbsDown" | "send" | "visualizationArea" | "visualizationTable" | "visualizationTreemap" | "visualizationScatter" | "visualizationDonut" | "visualizationHeadline" | "visualizationColumn" | "visualizationLine" | "visualizationPyramid" | "visualizationFunnel" | "visualizationHeatmap" | "visualizationBubble" | "visualizationPie" | "visualizationBar" | "visualizationCombo" | "visualizationBullet" | "visualizationWaterfall" | "visualizationDependencywheel" | "visualizationSankey" | "visualizationPushpin" | "visualizationRepeater" | "visualizationXirr" | "link" | "externalLink" | "click" | "fileXlsx" | "filePptx" | "filePdf" | "fileImage" | "fileCsvFormatted" | "fileCsvRaw" | "aiDocument" | "recommendation" | "streamUp" | "streamDown" | "stream" | "density" | "parameter" | "pin" | "unpin" | "speechBubble" | "pieChart" | "timezone";
+export type IconType = "aiAgent" | "aiAgentDisabled" | "brain" | "brainDisabled" | "check" | "checkCircle" | "certification" | "plus" | "plusCircle" | "sync" | "alert" | "alertPaused" | "close" | "cross" | "edit" | "crossCircle" | "question" | "chevronUp" | "chevronRight" | "chevronDown" | "chevronLeft" | "date" | "navigateUp" | "navigateDown" | "navigateRight" | "navigateLeft" | "download" | "slack" | "expand" | "exclamationCircle" | "infoCircle" | "book" | "visible" | "invisible" | "lock" | "unlock" | "ai" | "aiFill" | "drawer" | "drawerEmpty" | "prohibited" | "dropDown" | "dropRight" | "clock" | "clockPaused" | "questionMark" | "upload" | "expandRectangle" | "file" | "number" | "code" | "user" | "userPlus" | "users" | "magic" | "tab" | "pauseCircle" | "filter" | "timer" | "mail" | "envelope" | "copy" | "rain" | "earth" | "geoCollection" | "geoCollectionUpload" | "minimize" | "shrink" | "copyright" | "ellipsis" | "pencil" | "folder" | "folderSmall" | "folderPlus" | "trash" | "arrowUp" | "arrowRight" | "arrowDown" | "arrowLeft" | "undo" | "redo" | "trendDown" | "trendUp" | "save" | "minus" | "minusCircle" | "percent" | "enter" | "enterRight" | "money" | "ghost" | "warning" | "home" | "settings" | "search" | "university" | "building" | "printer" | "picture" | "visualization" | "dashboard" | "metric" | "fact" | "ldmAttribute" | "ldmKey" | "ldmLabel" | "sharp" | "attribute" | "horn" | "cw" | "ccw" | "table" | "directionColumn" | "directionRow" | "alignLeft" | "alignCenter" | "alignRight" | "alignTop" | "alignMiddle" | "alignBottom" | "imageContain" | "imageCover" | "imageFill" | "header" | "genai" | "genai2" | "explainai" | "hiddenForAi" | "box" | "ellipsisVertical" | "list" | "drillTo" | "hierarchy" | "history" | "history2" | "thumbsUp" | "thumbsDown" | "send" | "visualizationArea" | "visualizationTable" | "visualizationTreemap" | "visualizationScatter" | "visualizationDonut" | "visualizationHeadline" | "visualizationColumn" | "visualizationLine" | "visualizationPyramid" | "visualizationFunnel" | "visualizationHeatmap" | "visualizationBubble" | "visualizationPie" | "visualizationBar" | "visualizationCombo" | "visualizationBullet" | "visualizationWaterfall" | "visualizationDependencywheel" | "visualizationSankey" | "visualizationPushpin" | "visualizationRepeater" | "visualizationXirr" | "link" | "externalLink" | "click" | "fileXlsx" | "filePptx" | "filePdf" | "fileImage" | "fileCsvFormatted" | "fileCsvRaw" | "aiDocument" | "recommendation" | "streamUp" | "streamDown" | "stream" | "density" | "parameter" | "pin" | "unpin" | "speechBubble" | "pieChart" | "timezone";
 //# sourceMappingURL=icon.d.ts.map

package/esm/@ui/@types/icon.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"icon.d.ts","sourceRoot":"","sources":["../../../src/@ui/@types/icon.ts"],"names":[],"mappings":"AAEA;;GAEG;AACH,MAAM,MAAM,QAAQ,GACd,SAAS,GACT,iBAAiB,GACjB,OAAO,GACP,eAAe,GACf,OAAO,GACP,aAAa,GACb,eAAe,GACf,MAAM,GACN,YAAY,GACZ,MAAM,GACN,OAAO,GACP,aAAa,GACb,OAAO,GACP,OAAO,GACP,MAAM,GACN,aAAa,GACb,UAAU,GACV,WAAW,GACX,cAAc,GACd,aAAa,GACb,aAAa,GACb,MAAM,GACN,YAAY,GACZ,cAAc,GACd,eAAe,GACf,cAAc,GACd,UAAU,GACV,OAAO,GACP,QAAQ,GACR,mBAAmB,GACnB,YAAY,GACZ,MAAM,GACN,SAAS,GACT,WAAW,GACX,MAAM,GACN,QAAQ,GACR,IAAI,GACJ,QAAQ,GACR,QAAQ,GACR,aAAa,GACb,YAAY,GACZ,UAAU,GACV,WAAW,GACX,OAAO,GACP,aAAa,GACb,cAAc,GACd,QAAQ,GACR,iBAAiB,GACjB,MAAM,GACN,QAAQ,GACR,MAAM,GACN,MAAM,GACN,UAAU,GACV,OAAO,GACP,OAAO,GACP,KAAK,GACL,aAAa,GACb,QAAQ,GACR,OAAO,GACP,MAAM,GACN,UAAU,GACV,MAAM,GACN,MAAM,GACN,OAAO,GACP,eAAe,GACf,qBAAqB,GACrB,UAAU,GACV,QAAQ,GACR,WAAW,GACX,UAAU,GACV,QAAQ,GACR,QAAQ,GACR,aAAa,GACb,YAAY,GACZ,OAAO,GACP,SAAS,GACT,YAAY,GACZ,WAAW,GACX,WAAW,GACX,MAAM,GACN,MAAM,GACN,WAAW,GACX,SAAS,GACT,MAAM,GACN,OAAO,GACP,aAAa,GACb,SAAS,GACT,OAAO,GACP,YAAY,GACZ,OAAO,GACP,OAAO,GACP,SAAS,GACT,MAAM,GACN,UAAU,GACV,QAAQ,GACR,YAAY,GACZ,UAAU,GACV,SAAS,GACT,SAAS,GACT,eAAe,GACf,WAAW,GACX,QAAQ,GACR,MAAM,GACN,cAAc,GACd,QAAQ,GACR,UAAU,GACV,OAAO,GACP,WAAW,GACX,MAAM,GACN,IAAI,GACJ,KAAK,GACL,OAAO,GACP,iBAAiB,GACjB,cAAc,GACd,QAAQ,GACR,OAAO,GACP,QAAQ,GACR,WAAW,GACX,aAAa,GACb,KAAK,GACL,kBAAkB,GAClB,MAAM,GACN,SAAS,GACT,WAAW,GACX,SAAS,GACT,UAAU,GACV,UAAU,GACV,YAAY,GACZ,MAAM,GACN,mBAAmB,GACnB,oBAAoB,GACpB,sBAAsB,GACtB,sBAAsB,GACtB,oBAAoB,GACpB,uBAAuB,GACvB,qBAAqB,GACrB,mBAAmB,GACnB,sBAAsB,GACtB,qBAAqB,GACrB,sBAAsB,GACtB,qBAAqB,GACrB,kBAAkB,GAClB,kBAAkB,GAClB,oBAAoB,GACpB,qBAAqB,GACrB,wBAAwB,GACxB,8BAA8B,GAC9B,qBAAqB,GACrB,sBAAsB,GACtB,uBAAuB,GACvB,mBAAmB,GACnB,MAAM,GACN,cAAc,GACd,OAAO,GACP,UAAU,GACV,UAAU,GACV,SAAS,GACT,WAAW,GACX,kBAAkB,GAClB,YAAY,GACZ,YAAY,GACZ,gBAAgB,GAChB,UAAU,GACV,YAAY,GACZ,QAAQ,GACR,SAAS,GACT,WAAW,GACX,KAAK,GACL,OAAO,GACP,cAAc,GACd,UAAU,GACV,UAAU,CAAC"}
+{"version":3,"file":"icon.d.ts","sourceRoot":"","sources":["../../../src/@ui/@types/icon.ts"],"names":[],"mappings":"AAEA;;GAEG;AACH,MAAM,MAAM,QAAQ,GACd,SAAS,GACT,iBAAiB,GACjB,OAAO,GACP,eAAe,GACf,OAAO,GACP,aAAa,GACb,eAAe,GACf,MAAM,GACN,YAAY,GACZ,MAAM,GACN,OAAO,GACP,aAAa,GACb,OAAO,GACP,OAAO,GACP,MAAM,GACN,aAAa,GACb,UAAU,GACV,WAAW,GACX,cAAc,GACd,aAAa,GACb,aAAa,GACb,MAAM,GACN,YAAY,GACZ,cAAc,GACd,eAAe,GACf,cAAc,GACd,UAAU,GACV,OAAO,GACP,QAAQ,GACR,mBAAmB,GACnB,YAAY,GACZ,MAAM,GACN,SAAS,GACT,WAAW,GACX,MAAM,GACN,QAAQ,GACR,IAAI,GACJ,QAAQ,GACR,QAAQ,GACR,aAAa,GACb,YAAY,GACZ,UAAU,GACV,WAAW,GACX,OAAO,GACP,aAAa,GACb,cAAc,GACd,QAAQ,GACR,iBAAiB,GACjB,MAAM,GACN,QAAQ,GACR,MAAM,GACN,MAAM,GACN,UAAU,GACV,OAAO,GACP,OAAO,GACP,KAAK,GACL,aAAa,GACb,QAAQ,GACR,OAAO,GACP,MAAM,GACN,UAAU,GACV,MAAM,GACN,MAAM,GACN,OAAO,GACP,eAAe,GACf,qBAAqB,GACrB,UAAU,GACV,QAAQ,GACR,WAAW,GACX,UAAU,GACV,QAAQ,GACR,QAAQ,GACR,aAAa,GACb,YAAY,GACZ,OAAO,GACP,SAAS,GACT,YAAY,GACZ,WAAW,GACX,WAAW,GACX,MAAM,GACN,MAAM,GACN,WAAW,GACX,SAAS,GACT,MAAM,GACN,OAAO,GACP,aAAa,GACb,SAAS,GACT,OAAO,GACP,YAAY,GACZ,OAAO,GACP,OAAO,GACP,SAAS,GACT,MAAM,GACN,UAAU,GACV,QAAQ,GACR,YAAY,GACZ,UAAU,GACV,SAAS,GACT,SAAS,GACT,eAAe,GACf,WAAW,GACX,QAAQ,GACR,MAAM,GACN,cAAc,GACd,QAAQ,GACR,UAAU,GACV,OAAO,GACP,WAAW,GACX,MAAM,GACN,IAAI,GACJ,KAAK,GACL,OAAO,GACP,iBAAiB,GACjB,cAAc,GACd,WAAW,GACX,aAAa,GACb,YAAY,GACZ,UAAU,GACV,aAAa,GACb,aAAa,GACb,cAAc,GACd,YAAY,GACZ,WAAW,GACX,QAAQ,GACR,OAAO,GACP,QAAQ,GACR,WAAW,GACX,aAAa,GACb,KAAK,GACL,kBAAkB,GAClB,MAAM,GACN,SAAS,GACT,WAAW,GACX,SAAS,GACT,UAAU,GACV,UAAU,GACV,YAAY,GACZ,MAAM,GACN,mBAAmB,GACnB,oBAAoB,GACpB,sBAAsB,GACtB,sBAAsB,GACtB,oBAAoB,GACpB,uBAAuB,GACvB,qBAAqB,GACrB,mBAAmB,GACnB,sBAAsB,GACtB,qBAAqB,GACrB,sBAAsB,GACtB,qBAAqB,GACrB,kBAAkB,GAClB,kBAAkB,GAClB,oBAAoB,GACpB,qBAAqB,GACrB,wBAAwB,GACxB,8BAA8B,GAC9B,qBAAqB,GACrB,sBAAsB,GACtB,uBAAuB,GACvB,mBAAmB,GACnB,MAAM,GACN,cAAc,GACd,OAAO,GACP,UAAU,GACV,UAAU,GACV,SAAS,GACT,WAAW,GACX,kBAAkB,GAClB,YAAY,GACZ,YAAY,GACZ,gBAAgB,GAChB,UAAU,GACV,YAAY,GACZ,QAAQ,GACR,SAAS,GACT,WAAW,GACX,KAAK,GACL,OAAO,GACP,cAAc,GACd,UAAU,GACV,UAAU,CAAC"}

package/esm/@ui/UiChip/ChipActionButton.d.ts

@@ -0,0 +1,3 @@
+import { type IChipActionButtonProps } from "./types.js";
+export declare function ChipActionButton({ onAction, onActionKeyDown, actionAriaLabel, actionAriaDescribedBy, actionIcon, dataTestId }: IChipActionButtonProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=ChipActionButton.d.ts.map

package/esm/@ui/UiChip/ChipActionButton.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChipActionButton.d.ts","sourceRoot":"","sources":["../../../src/@ui/UiChip/ChipActionButton.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,KAAK,sBAAsB,EAAE,MAAM,YAAY,CAAC;AAIzD,wBAAgB,gBAAgB,CAAC,EAC7B,QAAQ,EACR,eAAe,EACf,eAAe,EACf,qBAAqB,EACrB,UAA+B,EAC/B,UAAU,EACb,EAAE,sBAAsB,2CAexB"}

package/esm/@ui/UiChip/ChipActionButton.js

@@ -0,0 +1,8 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+// (C) 2025-2026 GoodData Corporation
+import { bem } from "../@utils/bem.js";
+import { UiIcon } from "../UiIcon/UiIcon.js";
+const { e } = bem("gd-ui-kit-chip");
+export function ChipActionButton({ onAction, onActionKeyDown, actionAriaLabel, actionAriaDescribedBy, actionIcon = "ellipsisVertical", dataTestId, }) {
+    return (_jsx("button", { "data-testid": dataTestId ? `${dataTestId}-action-button` : undefined, "aria-label": actionAriaLabel, "aria-describedby": actionAriaDescribedBy, className: e("action"), onClick: onAction, onKeyDown: onActionKeyDown, children: _jsx("span", { className: e("icon-action"), children: _jsx(UiIcon, { type: actionIcon, color: "complementary-6", size: 14 }) }) }));
+}

package/esm/@ui/UiChip/ChipContent.d.ts

@@ -1,3 +1,3 @@
 import { type IChipContentProps } from "./types.js";
-export declare function ChipContent({ label, tag, iconBefore, iconAfter, iconColor, onClick, onKeyDown, isActive, isLocked, isExpandable, isDisabled, isDeletable, accessibilityConfig, dataTestId, buttonRef, styleObj }: IChipContentProps): import("react/jsx-runtime").JSX.Element;
+export declare function ChipContent({ label, tag, iconBefore, iconAfter, iconColor, variant, onClick, onKeyDown, isActive, isLocked, isExpandable, isDisabled, isDeletable, isActionable, accessibilityConfig, dataTestId, buttonRef, styleObj }: IChipContentProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=ChipContent.d.ts.map

package/esm/@ui/UiChip/ChipContent.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ChipContent.d.ts","sourceRoot":"","sources":["../../../src/@ui/UiChip/ChipContent.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,KAAK,iBAAiB,EAAE,MAAM,YAAY,CAAC;AAMpD,wBAAgB,WAAW,CAAC,EACxB,KAAK,EACL,GAAG,EACH,UAAU,EACV,SAAS,EACT,SAAqB,EACrB,OAAO,EACP,SAAS,EACT,QAAQ,EACR,QAAQ,EACR,YAAY,EACZ,UAAU,EACV,WAAW,EACX,mBAAmB,EACnB,UAAU,EACV,SAAS,EACT,QAAQ,EACX,EAAE,iBAAiB,2CA6EnB"}
+{"version":3,"file":"ChipContent.d.ts","sourceRoot":"","sources":["../../../src/@ui/UiChip/ChipContent.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,KAAK,iBAAiB,EAAE,MAAM,YAAY,CAAC;AAMpD,wBAAgB,WAAW,CAAC,EACxB,KAAK,EACL,GAAG,EACH,UAAU,EACV,SAAS,EACT,SAAqB,EACrB,OAAkB,EAClB,OAAO,EACP,SAAS,EACT,QAAQ,EACR,QAAQ,EACR,YAAY,EACZ,UAAU,EACV,WAAW,EACX,YAAY,EACZ,mBAAmB,EACnB,UAAU,EACV,SAAS,EACT,QAAQ,EACX,EAAE,iBAAiB,2CAuFnB"}

package/esm/@ui/UiChip/ChipContent.js

@@ -4,8 +4,8 @@ import { bem } from "../@utils/bem.js";
 import { UiIcon } from "../UiIcon/UiIcon.js";
 const { e } = bem("gd-ui-kit-chip");
 const ICON_SIZE = 14;
-export function ChipContent({ label, tag, iconBefore, iconAfter, iconColor = "primary", onClick, onKeyDown, isActive, isLocked, isExpandable, isDisabled, isDeletable, accessibilityConfig, dataTestId, buttonRef, styleObj, }) {
-    const { isExpanded, popupId, popupType, ariaHaspopup, ariaLabel, ariaLabelledBy, ariaControls, iconBeforeAriaLabel, } = accessibilityConfig ?? {};
+export function ChipContent({ label, tag, iconBefore, iconAfter, iconColor = "primary", variant = "normal", onClick, onKeyDown, isActive, isLocked, isExpandable, isDisabled, isDeletable, isActionable, accessibilityConfig, dataTestId, buttonRef, styleObj, }) {
+    const { isExpanded, popupId, popupType, ariaHaspopup, ariaLabel, ariaLabelledBy, ariaControls, iconBeforeAriaLabel, iconAfterAriaLabel, } = accessibilityConfig ?? {};
     const isDropdownTrigger = isExpandable || isExpanded !== undefined || popupId !== undefined;
     const ariaDropdownProps = isDropdownTrigger
         ? {
@@ -16,9 +16,11 @@ export function ChipContent({ label, tag, iconBefore, iconAfter, iconColor = "pr
         }
         : {};
     return (_jsxs("button", { "data-testid": dataTestId, className: e("trigger", {
+            variant,
+            isActive,
             isDeletable,
+            isActionable,
             hasIconAfter: !!iconAfter,
-            isActive,
             isLocked: isLocked || isDisabled,
-        }), disabled: isDisabled, onClick: isLocked ? undefined : onClick, onKeyDown: onKeyDown, style: { ...styleObj }, ref: buttonRef, "aria-disabled": isLocked || isDisabled, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, ...ariaDropdownProps, children: [iconBefore ? (_jsx("span", { className: e("icon-before"), children: _jsx(UiIcon, { type: iconBefore, color: iconColor, size: ICON_SIZE, accessibilityConfig: iconBeforeAriaLabel ? { ariaLabel: iconBeforeAriaLabel } : undefined }) })) : null, _jsx("span", { className: e("label"), children: label }), tag ? _jsx("span", { className: e("tag"), children: tag }) : null, isDisabled ? null : (_jsx(_Fragment, { children: isLocked ? (_jsx("span", { className: e("icon-lock"), children: _jsx(UiIcon, { type: "lock", color: "complementary-6", size: 14 }) })) : isExpandable ? (_jsx("span", { className: e("icon-chevron", { isActive }), children: _jsx(UiIcon, { type: isActive ? "chevronUp" : "chevronDown", color: "complementary-7", size: 8 }) })) : iconAfter ? (_jsx("span", { className: e("icon-after"), children: _jsx(UiIcon, { type: iconAfter, color: iconColor, size: ICON_SIZE }) })) : null }))] }));
+        }), disabled: isDisabled, onClick: isLocked ? undefined : onClick, onKeyDown: onKeyDown, style: { ...styleObj }, ref: buttonRef, "aria-disabled": isLocked || isDisabled, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, ...ariaDropdownProps, children: [iconBefore ? (_jsx("span", { className: e("icon-before"), children: _jsx(UiIcon, { type: iconBefore, color: iconColor, size: ICON_SIZE, accessibilityConfig: iconBeforeAriaLabel ? { ariaLabel: iconBeforeAriaLabel } : undefined }) })) : null, _jsx("span", { className: e("label"), children: label }), tag ? _jsx("span", { className: e("tag"), children: tag }) : null, isDisabled ? null : (_jsx(_Fragment, { children: isLocked ? (_jsx("span", { className: e("icon-lock"), children: _jsx(UiIcon, { type: "lock", color: "complementary-6", size: 14 }) })) : isExpandable ? (_jsx("span", { className: e("icon-chevron", { isActive }), children: _jsx(UiIcon, { type: isActive ? "chevronUp" : "chevronDown", color: "complementary-7", size: 8 }) })) : iconAfter ? (_jsx("span", { className: e("icon-after"), children: _jsx(UiIcon, { type: iconAfter, color: iconColor, size: ICON_SIZE, accessibilityConfig: iconAfterAriaLabel ? { ariaLabel: iconAfterAriaLabel } : undefined }) })) : null }))] }));
 }

package/esm/@ui/UiChip/ChipDeleteButton.d.ts

@@ -1,3 +1,3 @@
 import { type IChipDeleteButtonProps } from "./types.js";
-export declare function ChipDeleteButton({ onDelete, onDeleteKeyDown, deleteAriaLabel, dataTestId }: IChipDeleteButtonProps): import("react/jsx-runtime").JSX.Element;
+export declare function ChipDeleteButton({ onDelete, onDeleteKeyDown, deleteAriaLabel, deleteAriaDescribedBy, dataTestId }: IChipDeleteButtonProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=ChipDeleteButton.d.ts.map

package/esm/@ui/UiChip/ChipDeleteButton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ChipDeleteButton.d.ts","sourceRoot":"","sources":["../../../src/@ui/UiChip/ChipDeleteButton.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,KAAK,sBAAsB,EAAE,MAAM,YAAY,CAAC;AAIzD,wBAAgB,gBAAgB,CAAC,EAC7B,QAAQ,EACR,eAAe,EACf,eAAe,EACf,UAAU,EACb,EAAE,sBAAsB,2CAcxB"}
+{"version":3,"file":"ChipDeleteButton.d.ts","sourceRoot":"","sources":["../../../src/@ui/UiChip/ChipDeleteButton.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,KAAK,sBAAsB,EAAE,MAAM,YAAY,CAAC;AAIzD,wBAAgB,gBAAgB,CAAC,EAC7B,QAAQ,EACR,eAAe,EACf,eAAe,EACf,qBAAqB,EACrB,UAAU,EACb,EAAE,sBAAsB,2CAexB"}

package/esm/@ui/UiChip/ChipDeleteButton.js

@@ -3,6 +3,6 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { bem } from "../@utils/bem.js";
 import { UiIcon } from "../UiIcon/UiIcon.js";
 const { e } = bem("gd-ui-kit-chip");
-export function ChipDeleteButton({ onDelete, onDeleteKeyDown, deleteAriaLabel, dataTestId, }) {
-    return (_jsx("button", { "data-testid": dataTestId ? `${dataTestId}-delete-button` : undefined, "aria-label": deleteAriaLabel, className: e("delete"), onClick: onDelete, onKeyDown: onDeleteKeyDown, children: _jsx("span", { className: e("icon-delete"), children: _jsx(UiIcon, { type: "cross", color: "complementary-6", size: 14 }) }) }));
+export function ChipDeleteButton({ onDelete, onDeleteKeyDown, deleteAriaLabel, deleteAriaDescribedBy, dataTestId, }) {
+    return (_jsx("button", { "data-testid": dataTestId ? `${dataTestId}-delete-button` : undefined, "aria-label": deleteAriaLabel, "aria-describedby": deleteAriaDescribedBy, className: e("delete"), onClick: onDelete, onKeyDown: onDeleteKeyDown, children: _jsx("span", { className: e("icon-delete"), children: _jsx(UiIcon, { type: "cross", color: "complementary-6", size: 14 }) }) }));
 }

package/esm/@ui/UiChip/UiChip.d.ts

@@ -2,5 +2,5 @@ import { type IUiChipProps } from "./types.js";
 /**
  * @internal
  */
-export declare function UiChip({ label, tag, isDeletable, isActive, isLocked, isExpandable, isDisabled, maxWidth, iconBefore, iconAfter, iconColor, onClick, onDelete, onKeyDown, onDeleteKeyDown, accessibilityConfig, dataTestId, buttonRef, renderChipContent, renderDeleteButton }: IUiChipProps): import("react/jsx-runtime").JSX.Element;
+export declare function UiChip({ label, tag, isDeletable, isActionable, isActive, isLocked, isExpandable, isDisabled, maxWidth, iconBefore, iconAfter, iconColor, onClick, onKeyDown, onDelete, onDeleteKeyDown, onAction, onActionKeyDown, accessibilityConfig, dataTestId, buttonRef, iconAction, variant, renderChipContent, renderActionButton }: IUiChipProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=UiChip.d.ts.map

package/esm/@ui/UiChip/UiChip.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"UiChip.d.ts","sourceRoot":"","sources":["../../../src/@ui/UiChip/UiChip.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,YAAY,CAAC;AAI/C;;GAEG;AACH,wBAAgB,MAAM,CAAC,EACnB,KAAK,EACL,GAAG,EACH,WAAmB,EACnB,QAAgB,EAChB,QAAgB,EAChB,YAAmB,EACnB,UAAkB,EAClB,QAAQ,EACR,UAAU,EACV,SAAS,EACT,SAAqB,EACrB,OAAO,EACP,QAAQ,EACR,SAAS,EACT,eAAe,EACf,mBAAmB,EACnB,UAAU,EACV,SAAS,EACT,iBAAiB,EACjB,kBAAkB,EACrB,EAAE,YAAY,2CAsDd"}
+{"version":3,"file":"UiChip.d.ts","sourceRoot":"","sources":["../../../src/@ui/UiChip/UiChip.tsx"],"names":[],"mappings":"AASA,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,YAAY,CAAC;AAI/C;;GAEG;AACH,wBAAgB,MAAM,CAAC,EACnB,KAAK,EACL,GAAG,EACH,WAAmB,EACnB,YAAoB,EACpB,QAAgB,EAChB,QAAgB,EAChB,YAAmB,EACnB,UAAkB,EAClB,QAAQ,EACR,UAAU,EACV,SAAS,EACT,SAAqB,EACrB,OAAO,EACP,SAAS,EACT,QAAQ,EACR,eAAe,EACf,QAAQ,EACR,eAAe,EACf,mBAAmB,EACnB,UAAU,EACV,SAAS,EACT,UAAU,EACV,OAAkB,EAClB,iBAAiB,EACjB,kBAAkB,EACrB,EAAE,YAAY,2CAuEd"}

package/esm/@ui/UiChip/UiChip.js

@@ -2,13 +2,14 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 // (C) 2025-2026 GoodData Corporation
 import { useLayoutEffect, useRef, useState } from "react";
 import { bem } from "../@utils/bem.js";
+import { ChipActionButton } from "./ChipActionButton.js";
 import { ChipContent } from "./ChipContent.js";
 import { ChipDeleteButton } from "./ChipDeleteButton.js";
 const { b } = bem("gd-ui-kit-chip");
 /**
  * @internal
  */
-export function UiChip({ label, tag, isDeletable = false, isActive = false, isLocked = false, isExpandable = true, isDisabled = false, maxWidth, iconBefore, iconAfter, iconColor = "primary", onClick, onDelete, onKeyDown, onDeleteKeyDown, accessibilityConfig, dataTestId, buttonRef, renderChipContent, renderDeleteButton, }) {
+export function UiChip({ label, tag, isDeletable = false, isActionable = false, isActive = false, isLocked = false, isExpandable = true, isDisabled = false, maxWidth, iconBefore, iconAfter, iconColor = "primary", onClick, onKeyDown, onDelete, onDeleteKeyDown, onAction, onActionKeyDown, accessibilityConfig, dataTestId, buttonRef, iconAction, variant = "normal", renderChipContent, renderActionButton, }) {
     const [styleObj, setStyleObj] = useState();
     const defaultButtonRef = useRef(null);
     const effectiveButtonRef = buttonRef || defaultButtonRef;
@@ -20,8 +21,10 @@ export function UiChip({ label, tag, isDeletable = false, isActive = false, isLo
             setStyleObj({ width });
         }
     }, [label, tag, effectiveButtonRef]);
-    const { deleteAriaLabel, deleteAriaDescribedBy } = accessibilityConfig ?? {};
-    const chipContent = (_jsx(ChipContent, { label: label, tag: tag, iconBefore: iconBefore, iconAfter: iconAfter, iconColor: iconColor, onClick: onClick, onKeyDown: onKeyDown, isActive: isActive, isLocked: isLocked, isExpandable: isExpandable, isDisabled: isDisabled, isDeletable: isDeletable, maxWidth: maxWidth, accessibilityConfig: accessibilityConfig, dataTestId: dataTestId, buttonRef: effectiveButtonRef, styleObj: styleObj }));
-    const deleteButton = isDeletable ? (_jsx(ChipDeleteButton, { onDelete: onDelete, onDeleteKeyDown: onDeleteKeyDown, deleteAriaLabel: deleteAriaLabel, deleteAriaDescribedBy: deleteAriaDescribedBy, dataTestId: dataTestId })) : null;
-    return (_jsxs("div", { className: b(), style: { maxWidth }, children: [renderChipContent ? renderChipContent(chipContent) : chipContent, deleteButton && renderDeleteButton ? renderDeleteButton(deleteButton) : deleteButton] }));
+    const { deleteAriaLabel, deleteAriaDescribedBy, actionAriaLabel, actionAriaDescribedBy } = accessibilityConfig ?? {};
+    const chipContent = (_jsx(ChipContent, { label: label, tag: tag, variant: variant, iconBefore: iconBefore, iconAfter: iconAfter, iconColor: iconColor, onClick: onClick, onKeyDown: onKeyDown, isActive: isActive, isLocked: isLocked, isExpandable: isExpandable, isDisabled: isDisabled, isDeletable: isDeletable, isActionable: isActionable, maxWidth: maxWidth, accessibilityConfig: accessibilityConfig, dataTestId: dataTestId, buttonRef: effectiveButtonRef, styleObj: styleObj }));
+    const actionButton = isDeletable ? (_jsx(ChipDeleteButton, { onDelete: onDelete, onDeleteKeyDown: onDeleteKeyDown, deleteAriaLabel: deleteAriaLabel, deleteAriaDescribedBy: deleteAriaDescribedBy, dataTestId: dataTestId })) : isActionable ? (_jsx(ChipActionButton, { onAction: onAction, onActionKeyDown: onActionKeyDown, actionIcon: iconAction, actionAriaLabel: actionAriaLabel, actionAriaDescribedBy: actionAriaDescribedBy, dataTestId: dataTestId })) : null;
+    return (_jsxs("div", { className: b({
+            variant,
+        }), style: { maxWidth }, children: [renderChipContent ? renderChipContent(chipContent) : chipContent, actionButton && renderActionButton ? renderActionButton(actionButton) : actionButton] }));
 }

package/esm/@ui/UiChip/types.d.ts

@@ -10,6 +10,9 @@ export interface IUiChipAccessibilityConfig extends IAccessibilityConfigBase, ID
     deleteAriaLabel?: string;
     deleteAriaDescribedBy?: string;
     iconBeforeAriaLabel?: string;
+    iconAfterAriaLabel?: string;
+    actionAriaLabel?: string;
+    actionAriaDescribedBy?: string;
 }
 /**
  * @internal
@@ -18,23 +21,28 @@ export interface IUiChipProps {
     label: string;
     tag?: string;
     isDeletable?: boolean;
+    isActionable?: boolean;
     isActive?: boolean;
     isLocked?: boolean;
     isExpandable?: boolean;
     isDisabled?: boolean;
     maxWidth?: number;
+    iconAction?: IconType;
     iconBefore?: IconType;
     iconAfter?: IconType;
     iconColor?: ThemeColor | "currentColor";
+    variant?: "normal" | "inactive";
     onClick?: () => void;
     onDelete?: () => void;
     onKeyDown?: KeyboardEventHandler<HTMLButtonElement>;
     onDeleteKeyDown?: KeyboardEventHandler<HTMLButtonElement>;
+    onAction?: () => void;
+    onActionKeyDown?: KeyboardEventHandler<HTMLButtonElement>;
     accessibilityConfig?: IUiChipAccessibilityConfig;
     dataTestId?: string;
     buttonRef?: MutableRefObject<HTMLButtonElement>;
     renderChipContent?: (content: ReactNode) => ReactNode;
-    renderDeleteButton?: (button: ReactNode) => ReactNode;
+    renderActionButton?: (button: ReactNode) => ReactNode;
 }
 export interface IChipContentProps {
     label: string;
@@ -50,6 +58,8 @@ export interface IChipContentProps {
     isDisabled: boolean;
     maxWidth?: number;
     isDeletable: boolean;
+    isActionable: boolean;
+    variant?: "normal" | "inactive";
     accessibilityConfig?: IUiChipAccessibilityConfig;
     dataTestId?: string;
     buttonRef: MutableRefObject<HTMLButtonElement> | RefObject<HTMLButtonElement | null>;
@@ -62,4 +72,12 @@ export interface IChipDeleteButtonProps {
     deleteAriaDescribedBy?: string;
     dataTestId?: string;
 }
+export interface IChipActionButtonProps {
+    onAction?: () => void;
+    onActionKeyDown?: KeyboardEventHandler<HTMLButtonElement>;
+    actionAriaLabel?: string;
+    actionAriaDescribedBy?: string;
+    actionIcon?: IconType;
+    dataTestId?: string;
+}
 //# sourceMappingURL=types.d.ts.map

package/esm/@ui/UiChip/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/@ui/UiChip/types.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/@ui/UiChip/types.ts"],"names":[],"mappings":"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"}

package/esm/@ui/UiColorPicker/UiColorPicker.d.ts

@@ -0,0 +1,6 @@
+import { type IUiColorPickerProps } from "./types.js";
+/**
+ * @internal
+ */
+export declare function UiColorPicker(props: IUiColorPickerProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=UiColorPicker.d.ts.map

package/esm/@ui/UiColorPicker/UiColorPicker.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"UiColorPicker.d.ts","sourceRoot":"","sources":["../../../src/@ui/UiColorPicker/UiColorPicker.tsx"],"names":[],"mappings":"AAmBA,OAAO,EAAE,KAAK,mBAAmB,EAAE,MAAM,YAAY,CAAC;AAMtD;;GAEG;AACH,wBAAgB,aAAa,CAAC,KAAK,EAAE,mBAAmB,2CAqFvD"}

package/esm/@ui/UiColorPicker/UiColorPicker.js

@@ -0,0 +1,49 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+// (C) 2007-2026 GoodData Corporation
+import { useState } from "react";
+import { useIntl } from "react-intl";
+import { UiButton } from "../UiButton/UiButton.js";
+import { areColorPickerValuesEqual, colorPickerValueFromRgb, colorPickerValueToRgba, formatColorPickerValue, } from "./colorValue.js";
+import { UiColorSlider } from "./components/UiColorSlider.js";
+import { UiColorValueField } from "./components/UiColorValueField.js";
+import { UiColorWheel } from "./components/UiColorWheel.js";
+function hslTrack(value, lightness) {
+    return `hsl(${Math.round(value.h)}, ${Math.round(value.s * 100)}%, ${Math.round(lightness * 100)}%)`;
+}
+/**
+ * @internal
+ */
+export function UiColorPicker(props) {
+    const { initialRgbColor, supportsAlpha = false, onChange, onSubmit } = props;
+    const intl = useIntl();
+    // Without a control to change it, an opacity would be one the caller cannot see and its consumer
+    // drops on the way out, so it is not carried at all.
+    const opaque = (color) => supportsAlpha ? color : { ...color, alpha: 1 };
+    const initial = opaque(colorPickerValueFromRgb(initialRgbColor));
+    const given = formatColorPickerValue(initial, "rgb");
+    const [notation, setNotation] = useState("hex");
+    // A color set from outside is followed - see IUiColorPickerBaseProps.initialRgbColor. The color
+    // and the one it was read from are held together so a change of one cannot be read against the
+    // other, and compared as text because the prop is a fresh object every render.
+    const [picked, setPicked] = useState({
+        value: initial,
+        given,
+    });
+    if (picked.given !== given) {
+        setPicked({ value: initial, given });
+    }
+    const value = picked.value;
+    const change = (next) => {
+        const kept = opaque(next);
+        setPicked({ value: kept, given });
+        onChange?.(colorPickerValueToRgba(kept));
+    };
+    const solid = hslTrack(value, value.l);
+    const current = formatColorPickerValue(value, "hsl");
+    return (_jsxs("div", { className: "gd-ui-kit-color-picker", "aria-label": "Color picker", children: [
+            _jsx(UiColorWheel, { value: value, onChange: change, label: intl.formatMessage({ id: "gs.ui-color-picker.wheel" }) }), _jsx(UiColorSlider, { label: intl.formatMessage({ id: "gs.ui-color-picker.lightness" }), value: value.l, onChange: (l) => change({ ...value, l }), trackStyle: {
+                    background: `linear-gradient(to right, ${hslTrack(value, 0)}, ${hslTrack(value, 0.5)}, ${hslTrack(value, 1)})`,
+                }, thumbColor: solid, valueText: current }), supportsAlpha ? (_jsx(UiColorSlider, { label: intl.formatMessage({ id: "gs.ui-color-picker.opacity" }), value: value.alpha, onChange: (alpha) => change({ ...value, alpha }), trackStyle: { background: `linear-gradient(to right, transparent, ${solid})` }, thumbColor: current, valueText: `${Math.round(value.alpha * 100)}%` })) : null, _jsx(UiColorValueField, { value: value, onChange: change, notation: notation, onNotationChange: setNotation, label: intl.formatMessage({ id: "gs.ui-color-picker.value" }), notationLabel: intl.formatMessage({ id: "gs.ui-color-picker.notation" }) }), onSubmit ? (_jsxs("div", { className: "gd-ui-kit-color-picker__actions", children: [
+                    _jsx(UiButton, { variant: "secondary", label: intl.formatMessage({ id: "gs.ui-color-picker.cancelButton" }), onClick: props.onCancel }), _jsx(UiButton, { variant: "primary", label: intl.formatMessage({ id: "gs.ui-color-picker.okButton" }), isDisabled: areColorPickerValuesEqual(initial, value), onClick: () => onSubmit(colorPickerValueToRgba(value)) })
+                ] })) : null] }));
+}

package/esm/@ui/UiColorPicker/colorValue.d.ts

@@ -0,0 +1,58 @@
+import { type ColorFormats } from "tinycolor2";
+export type ColorNotation = "hex" | "rgb" | "hsl";
+export declare const COLOR_NOTATIONS: readonly ColorNotation[];
+/**
+ * The picker's working color.
+ *
+ * @remarks
+ * Held as hue, saturation and lightness because that is what the controls address. Kept as channels
+ * instead, turning the wheel at an extreme lightness would not come back to the hue it started from:
+ * every gray, black and white is the same hue once written as channels.
+ */
+export interface IColorPickerValue extends ColorFormats.HSL {
+    alpha: number;
+}
+/**
+ * A point on the wheel, as a fraction of its radius from the middle, in screen orientation.
+ */
+export interface IColorWheelPoint {
+    x: number;
+    y: number;
+}
+export declare function colorPickerValueFromRgb(rgb: ColorFormats.RGB | ColorFormats.RGBA): IColorPickerValue;
+export declare function colorPickerValueToRgba(value: IColorPickerValue): ColorFormats.RGBA;
+export declare function areColorPickerValuesEqual(left: IColorPickerValue, right: IColorPickerValue): boolean;
+/**
+ * Writes the value in the given notation.
+ *
+ * @remarks
+ * Opacity is written only where there is some, so an opaque color reads as the plain three-channel
+ * form.
+ */
+export declare function formatColorPickerValue(value: IColorPickerValue, notation: ColorNotation): string;
+/**
+ * Whether text can be applied to the document as it stands, mid-typing.
+ *
+ * @remarks
+ * Text is applied as it is typed, so parsing is not enough: a parser reads three hex digits as a
+ * color, a fourth as opacity, and `hsl(210, 53%, 1` — closed or not — as white.
+ */
+export declare function canApplyColorPickerValueWhileTyping(text: string): boolean;
+/**
+ * Reads a color from text.
+ *
+ * @remarks
+ * A gray states no hue, and a parser reports 0 for it, so the current hue is carried over. Taken
+ * literally the wheel would swing to red the moment someone typed a gray.
+ */
+export declare function parseColorPickerValue(text: string, current: IColorPickerValue): IColorPickerValue | undefined;
+/**
+ * Reads a point on the wheel as a hue and a saturation.
+ *
+ * @remarks
+ * Past the rim the saturation clamps rather than the gesture being dropped, which keeps a drag live
+ * when the pointer leaves the wheel.
+ */
+export declare function colorPickerValueFromWheel(point: IColorWheelPoint, current: IColorPickerValue): IColorPickerValue;
+export declare function colorPickerValueToWheel(value: IColorPickerValue): IColorWheelPoint;
+//# sourceMappingURL=colorValue.d.ts.map

package/esm/@ui/UiColorPicker/colorValue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"colorValue.d.ts","sourceRoot":"","sources":["../../../src/@ui/UiColorPicker/colorValue.ts"],"names":[],"mappings":"AAEA,OAAkB,EAAE,KAAK,YAAY,EAAE,MAAM,YAAY,CAAC;AAE1D,MAAM,MAAM,aAAa,GAAG,KAAK,GAAG,KAAK,GAAG,KAAK,CAAC;AAElD,eAAO,MAAM,eAAe,EAAE,SAAS,aAAa,EAA0B,CAAC;AAE/E;;;;;;;GAOG;AACH,MAAM,WAAW,iBAAkB,SAAQ,YAAY,CAAC,GAAG;IACvD,KAAK,EAAE,MAAM,CAAC;CACjB;AAED;;GAEG;AACH,MAAM,WAAW,gBAAgB;IAC7B,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;CACb;AAUD,wBAAgB,uBAAuB,CAAC,GAAG,EAAE,YAAY,CAAC,GAAG,GAAG,YAAY,CAAC,IAAI,GAAG,iBAAiB,CAGpG;AAED,wBAAgB,sBAAsB,CAAC,KAAK,EAAE,iBAAiB,GAAG,YAAY,CAAC,IAAI,CAGlF;AAED,wBAAgB,yBAAyB,CAAC,IAAI,EAAE,iBAAiB,EAAE,KAAK,EAAE,iBAAiB,GAAG,OAAO,CAIpG;AAED;;;;;;GAMG;AACH,wBAAgB,sBAAsB,CAAC,KAAK,EAAE,iBAAiB,EAAE,QAAQ,EAAE,aAAa,GAAG,MAAM,CAUhG;AAOD;;;;;;GAMG;AACH,wBAAgB,mCAAmC,CAAC,IAAI,EAAE,MAAM,GAAG,OAAO,CAGzE;AAED;;;;;;GAMG;AACH,wBAAgB,qBAAqB,CACjC,IAAI,EAAE,MAAM,EACZ,OAAO,EAAE,iBAAiB,GAC3B,iBAAiB,GAAG,SAAS,CAO/B;AAED;;;;;;GAMG;AACH,wBAAgB,yBAAyB,CACrC,KAAK,EAAE,gBAAgB,EACvB,OAAO,EAAE,iBAAiB,GAC3B,iBAAiB,CAQnB;AAED,wBAAgB,uBAAuB,CAAC,KAAK,EAAE,iBAAiB,GAAG,gBAAgB,CAGlF"}

package/esm/@ui/UiColorPicker/colorValue.js

@@ -0,0 +1,90 @@
+// (C) 2026 GoodData Corporation
+import tinycolor from "tinycolor2";
+export const COLOR_NOTATIONS = ["hex", "rgb", "hsl"];
+function clamp(value, min, max) {
+    return Math.min(max, Math.max(min, value));
+}
+function toTinyColor(value) {
+    return tinycolor({ h: value.h, s: value.s, l: value.l }).setAlpha(value.alpha);
+}
+export function colorPickerValueFromRgb(rgb) {
+    const { h, s, l, a } = tinycolor(rgb).toHsl();
+    return { h, s, l, alpha: a };
+}
+export function colorPickerValueToRgba(value) {
+    const { r, g, b } = toTinyColor(value).toRgb();
+    return { r, g, b, a: value.alpha };
+}
+export function areColorPickerValuesEqual(left, right) {
+    const a = colorPickerValueToRgba(left);
+    const b = colorPickerValueToRgba(right);
+    return a.r === b.r && a.g === b.g && a.b === b.b && a.a === b.a;
+}
+/**
+ * Writes the value in the given notation.
+ *
+ * @remarks
+ * Opacity is written only where there is some, so an opaque color reads as the plain three-channel
+ * form.
+ */
+export function formatColorPickerValue(value, notation) {
+    const color = toTinyColor(value);
+    switch (notation) {
+        case "hex":
+            return value.alpha === 1 ? color.toHexString() : color.toHex8String();
+        case "rgb":
+            return color.toRgbString();
+        case "hsl":
+            return color.toHslString();
+    }
+}
+const APPLICABLE_WHILE_TYPING = [
+    /^#?(?:[0-9a-f]{6}|[0-9a-f]{8})$/i,
+    /^(?:rgb|hsl)a?\([^()]*\)$/i,
+];
+/**
+ * Whether text can be applied to the document as it stands, mid-typing.
+ *
+ * @remarks
+ * Text is applied as it is typed, so parsing is not enough: a parser reads three hex digits as a
+ * color, a fourth as opacity, and `hsl(210, 53%, 1` — closed or not — as white.
+ */
+export function canApplyColorPickerValueWhileTyping(text) {
+    const trimmed = text.trim();
+    return APPLICABLE_WHILE_TYPING.some((shape) => shape.test(trimmed));
+}
+/**
+ * Reads a color from text.
+ *
+ * @remarks
+ * A gray states no hue, and a parser reports 0 for it, so the current hue is carried over. Taken
+ * literally the wheel would swing to red the moment someone typed a gray.
+ */
+export function parseColorPickerValue(text, current) {
+    const color = tinycolor(text.trim());
+    if (!color.isValid()) {
+        return undefined;
+    }
+    const { h, s, l, a } = color.toHsl();
+    return { h: s === 0 ? current.h : h, s, l, alpha: a };
+}
+/**
+ * Reads a point on the wheel as a hue and a saturation.
+ *
+ * @remarks
+ * Past the rim the saturation clamps rather than the gesture being dropped, which keeps a drag live
+ * when the pointer leaves the wheel.
+ */
+export function colorPickerValueFromWheel(point, current) {
+    const saturation = clamp(Math.hypot(point.x, point.y), 0, 1);
+    // The exact middle points in no direction, so there is no hue to read from it.
+    if (saturation === 0) {
+        return { ...current, s: 0 };
+    }
+    const angle = (Math.atan2(point.y, point.x) * 180) / Math.PI;
+    return { ...current, h: (angle + 360) % 360, s: saturation };
+}
+export function colorPickerValueToWheel(value) {
+    const radians = (value.h * Math.PI) / 180;
+    return { x: Math.cos(radians) * value.s, y: Math.sin(radians) * value.s };
+}

package/esm/@ui/UiColorPicker/components/UiColorSlider.d.ts

@@ -0,0 +1,19 @@
+import { type CSSProperties } from "react";
+interface IColorSliderProps {
+    label: string;
+    /**
+     * Position along the track, from 0 at the left to 1 at the right.
+     */
+    value: number;
+    onChange: (value: number) => void;
+    trackStyle: CSSProperties;
+    thumbColor: string;
+    /**
+     * The value as it should be read out: the fraction on its own says nothing about which channel
+     * this is.
+     */
+    valueText: string;
+}
+export declare function UiColorSlider({ label, value, onChange, trackStyle, thumbColor, valueText }: IColorSliderProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=UiColorSlider.d.ts.map

package/esm/@ui/UiColorPicker/components/UiColorSlider.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"UiColorSlider.d.ts","sourceRoot":"","sources":["../../../../src/@ui/UiColorPicker/components/UiColorSlider.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,aAAa,EAAsB,MAAM,OAAO,CAAC;AAM/D,UAAU,iBAAiB;IACvB,KAAK,EAAE,MAAM,CAAC;IAEd;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IAEd,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAElC,UAAU,EAAE,aAAa,CAAC;IAE1B,UAAU,EAAE,MAAM,CAAC;IAEnB;;;OAGG;IACH,SAAS,EAAE,MAAM,CAAC;CACrB;AAED,wBAAgB,aAAa,CAAC,EAC1B,KAAK,EACL,KAAK,EACL,QAAQ,EACR,UAAU,EACV,UAAU,EACV,SAAS,EACZ,EAAE,iBAAiB,2CAoDnB"}

package/esm/@ui/UiColorPicker/components/UiColorSlider.js

@@ -0,0 +1,35 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { usePointerTrack } from "../../hooks/usePointerTrack.js";
+const KEY_STEP = 0.02;
+export function UiColorSlider({ label, value, onChange, trackStyle, thumbColor, valueText, }) {
+    const track = usePointerTrack((event) => {
+        const rect = event.currentTarget.getBoundingClientRect();
+        const position = (event.clientX - rect.left) / rect.width;
+        onChange(Math.min(1, Math.max(0, position)));
+    });
+    const step = (delta) => onChange(Math.min(1, Math.max(0, value + delta)));
+    const onKeyDown = (event) => {
+        const moves = {
+            ArrowLeft: () => step(-KEY_STEP),
+            ArrowDown: () => step(-KEY_STEP),
+            ArrowRight: () => step(KEY_STEP),
+            ArrowUp: () => step(KEY_STEP),
+            Home: () => onChange(0),
+            End: () => onChange(1),
+        };
+        const move = moves[event.key];
+        if (move) {
+            event.preventDefault();
+            move();
+        }
+    };
+    return (_jsxs("div", { className: "gd-ui-kit-color-picker__slider", role: "slider", tabIndex: 0, "aria-label": label, "aria-valuemin": 0, "aria-valuemax": 100, "aria-valuenow": Math.round(value * 100), "aria-valuetext": valueText, onKeyDown: onKeyDown, ...track, children: [
+            _jsx("div", { className: "gd-ui-kit-color-picker__slider-track", style: trackStyle }), _jsx("div", { className: "gd-ui-kit-color-picker__slider-thumb", 
+                // The stylesheet turns the fraction into a position, so the handle's own size is
+                // accounted for in the one place that states it.
+                style: {
+                    "--color-picker-slider-position": value,
+                    backgroundColor: thumbColor,
+                } })
+        ] }));
+}

package/esm/@ui/UiColorPicker/components/UiColorValueField.d.ts

@@ -0,0 +1,12 @@
+import { type ColorNotation, type IColorPickerValue } from "../colorValue.js";
+interface IColorValueFieldProps {
+    value: IColorPickerValue;
+    onChange: (value: IColorPickerValue) => void;
+    notation: ColorNotation;
+    onNotationChange: (notation: ColorNotation) => void;
+    label: string;
+    notationLabel: string;
+}
+export declare function UiColorValueField({ value, onChange, notation, onNotationChange, label, notationLabel }: IColorValueFieldProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=UiColorValueField.d.ts.map

package/esm/@ui/UiColorPicker/components/UiColorValueField.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"UiColorValueField.d.ts","sourceRoot":"","sources":["../../../../src/@ui/UiColorPicker/components/UiColorValueField.tsx"],"names":[],"mappings":"AAQA,OAAO,EAEH,KAAK,aAAa,EAClB,KAAK,iBAAiB,EAIzB,MAAM,kBAAkB,CAAC;AAE1B,UAAU,qBAAqB;IAC3B,KAAK,EAAE,iBAAiB,CAAC;IACzB,QAAQ,EAAE,CAAC,KAAK,EAAE,iBAAiB,KAAK,IAAI,CAAC;IAC7C,QAAQ,EAAE,aAAa,CAAC;IACxB,gBAAgB,EAAE,CAAC,QAAQ,EAAE,aAAa,KAAK,IAAI,CAAC;IACpD,KAAK,EAAE,MAAM,CAAC;IACd,aAAa,EAAE,MAAM,CAAC;CACzB;AAED,wBAAgB,iBAAiB,CAAC,EAC9B,KAAK,EACL,QAAQ,EACR,QAAQ,EACR,gBAAgB,EAChB,KAAK,EACL,aAAa,EAChB,EAAE,qBAAqB,2CAyEvB"}

package/esm/@ui/UiColorPicker/components/UiColorValueField.js

@@ -0,0 +1,40 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+// (C) 2026 GoodData Corporation
+import { useState } from "react";
+import { UiButton } from "../../UiButton/UiButton.js";
+import { UiDropdown } from "../../UiDropdown/UiDropdown.js";
+import { UiListbox } from "../../UiListbox/UiListbox.js";
+import { UiTextInput } from "../../UiTextInput/UiTextInput.js";
+import { COLOR_NOTATIONS, canApplyColorPickerValueWhileTyping, formatColorPickerValue, parseColorPickerValue, } from "../colorValue.js";
+export function UiColorValueField({ value, onChange, notation, onNotationChange, label, notationLabel, }) {
+    // Held only while the field is being typed into: rendering the value it last parsed to would
+    // fight the typing character by character.
+    const [draft, setDraft] = useState();
+    const type = (text) => {
+        setDraft(text);
+        const parsed = parseColorPickerValue(text, value);
+        if (parsed && canApplyColorPickerValueWhileTyping(text)) {
+            onChange(parsed);
+        }
+    };
+    // What was only typed through is applied once the typing stops.
+    const settle = () => {
+        const parsed = draft === undefined ? undefined : parseColorPickerValue(draft, value);
+        if (parsed) {
+            onChange(parsed);
+        }
+        setDraft(undefined);
+    };
+    const items = COLOR_NOTATIONS.map((option) => ({
+        type: "interactive",
+        id: option,
+        stringTitle: option.toUpperCase(),
+        data: option,
+    }));
+    return (_jsxs("div", { className: "gd-ui-kit-color-picker__value", children: [
+            _jsx(UiTextInput, { value: draft ?? formatColorPickerValue(value, notation), onChange: type, onBlur: settle, onKeyDown: (event) => {
+                    if (event.key === "Enter") {
+                        settle();
+                    }
+                }, isError: draft !== undefined && parseColorPickerValue(draft, value) === undefined, accessibilityConfig: { ariaLabel: label }, dataTestId: "ui-color-picker-value" }), _jsx(UiDropdown, { closeOnEscape: true, width: "auto", accessibilityConfig: { triggerRole: "combobox", popupRole: "listbox" }, renderButton: ({ ref, isOpen, toggleDropdown, ariaAttributes }) => (_jsx(UiButton, { ref: ref, size: "small", variant: "secondary", label: notation.toUpperCase(), iconAfter: isOpen ? "navigateUp" : "navigateDown", disableIconAnimation: true, onClick: toggleDropdown, accessibilityConfig: { ariaLabel: notationLabel, ...ariaAttributes } })), renderBody: ({ closeDropdown, ariaAttributes }) => (_jsx(UiListbox, { items: items, selectedItemId: notation, ariaAttributes: { ...ariaAttributes, "aria-label": notationLabel }, isCompact: true, onSelect: (item) => onNotationChange(item.data), onClose: closeDropdown })) })] }));
+}

package/esm/@ui/UiColorPicker/components/UiColorWheel.d.ts

@@ -0,0 +1,9 @@
+import { type IColorPickerValue } from "../colorValue.js";
+interface IColorWheelProps {
+    value: IColorPickerValue;
+    onChange: (value: IColorPickerValue) => void;
+    label: string;
+}
+export declare function UiColorWheel({ value, onChange, label }: IColorWheelProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=UiColorWheel.d.ts.map

package/esm/@ui/UiColorPicker/components/UiColorWheel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"UiColorWheel.d.ts","sourceRoot":"","sources":["../../../../src/@ui/UiColorPicker/components/UiColorWheel.tsx"],"names":[],"mappings":"AAKA,OAAO,EACH,KAAK,iBAAiB,EAIzB,MAAM,kBAAkB,CAAC;AAK1B,UAAU,gBAAgB;IACtB,KAAK,EAAE,iBAAiB,CAAC;IACzB,QAAQ,EAAE,CAAC,KAAK,EAAE,iBAAiB,KAAK,IAAI,CAAC;IAC7C,KAAK,EAAE,MAAM,CAAC;CACjB;AAKD,wBAAgB,YAAY,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,EAAE,gBAAgB,2CA+DxE"}