@useblu/ocean-react 1.113.1 → 1.114.0

package/CHANGELOG.md

@@ -3,6 +3,18 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [1.114.0](https://github.com/ocean-ds/ocean-web/compare/v1.113.2...v1.114.0) (2025-12-04)
+
+### Features
+
+- create internal list actions ([#1194](https://github.com/ocean-ds/ocean-web/issues/1194)) ([dafce53](https://github.com/ocean-ds/ocean-web/commit/dafce530677eacd471f91af2d2a936042b14f2f5))
+
+## [1.113.2](https://github.com/ocean-ds/ocean-web/compare/v1.113.1...v1.113.2) (2025-12-03)
+
+### Bug Fixes
+
+- chip multi select ([#1203](https://github.com/ocean-ds/ocean-web/issues/1203)) ([9943a81](https://github.com/ocean-ds/ocean-web/commit/9943a8160f8ab40eb8d325475c080d3ad7e32ffb))
+
 ## [1.113.1](https://github.com/ocean-ds/ocean-web/compare/v1.113.0...v1.113.1) (2025-11-26)
 
 ### Bug Fixes

package/Chips/Options.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Options.d.ts","sourceRoot":"","sources":["../../src/Chips/Options.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAEpC,UAAU,QAAQ;IAChB,OAAO,EAAE,KAAK,CAAC,SAAS,CAAC,CAAC;IAC1B,eAAe,EAAE,SAAS,EAAE,GAAG,SAAS,CAAC;IACzC,UAAU,EAAE,MAAM,CAAC;IACnB,WAAW,EAAE,MAAM,CAAC;IACpB,WAAW,EAAE,OAAO,CAAC;IACrB,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACjD,aAAa,EAAE,MAAM,IAAI,CAAC;IAC1B,YAAY,EAAE,MAAM,IAAI,CAAC;CAC1B;AAED,QAAA,MAAM,OAAO,EAAE,KAAK,CAAC,iBAAiB,CAAC,QAAQ,CAiE9C,CAAC;AAEF,eAAe,OAAO,CAAC"}
+{"version":3,"file":"Options.d.ts","sourceRoot":"","sources":["../../src/Chips/Options.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAEpC,UAAU,QAAQ;IAChB,OAAO,EAAE,KAAK,CAAC,SAAS,CAAC,CAAC;IAC1B,eAAe,EAAE,SAAS,EAAE,GAAG,SAAS,CAAC;IACzC,UAAU,EAAE,MAAM,CAAC;IACnB,WAAW,EAAE,MAAM,CAAC;IACpB,WAAW,EAAE,OAAO,CAAC;IACrB,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACjD,aAAa,EAAE,MAAM,IAAI,CAAC;IAC1B,YAAY,EAAE,MAAM,IAAI,CAAC;CAC1B;AAED,QAAA,MAAM,OAAO,EAAE,KAAK,CAAC,iBAAiB,CAAC,QAAQ,CAwF9C,CAAC;AAEF,eAAe,OAAO,CAAC"}

package/_shared/components/InternalListActions/InternalListActions.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+import { ActionItem } from './types';
+declare const InternalListActions: React.ForwardRefExoticComponent<{
+    actions: ActionItem[];
+    disabled?: boolean;
+    position?: "bottom-left" | "bottom-right" | "top-left" | "top-right";
+    actionType?: "menu" | "swipe";
+} & Omit<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof React.HTMLAttributes<HTMLDivElement>>, "children"> & React.RefAttributes<HTMLDivElement>>;
+export default InternalListActions;
+//# sourceMappingURL=InternalListActions.d.ts.map

package/_shared/components/InternalListActions/InternalListActions.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"InternalListActions.d.ts","sourceRoot":"","sources":["../../../../src/_shared/components/InternalListActions/InternalListActions.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkD,MAAM,OAAO,CAAC;AAEvE,OAAO,EAA4B,UAAU,EAAE,MAAM,SAAS,CAAC;AAK/D,QAAA,MAAM,mBAAmB;;;;;oMAgHxB,CAAC;AAIF,eAAe,mBAAmB,CAAC"}

package/_shared/components/InternalListActions/components/DragHandle.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+interface DragHandleProps {
+    onClose: () => void;
+    onKeyDown: (e: React.KeyboardEvent) => void;
+}
+declare const DragHandle: React.FC<DragHandleProps>;
+export default DragHandle;
+//# sourceMappingURL=DragHandle.d.ts.map

package/_shared/components/InternalListActions/components/DragHandle.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DragHandle.d.ts","sourceRoot":"","sources":["../../../../../src/_shared/components/InternalListActions/components/DragHandle.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAiB,MAAM,OAAO,CAAC;AAEtC,UAAU,eAAe;IACvB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,SAAS,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,aAAa,KAAK,IAAI,CAAC;CAC7C;AAKD,QAAA,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CA8DzC,CAAC;AAEF,eAAe,UAAU,CAAC"}

package/_shared/components/InternalListActions/components/MenuBackdrop.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+interface MenuBackdropProps {
+    onClick: () => void;
+}
+declare const MenuBackdrop: React.FC<MenuBackdropProps>;
+export default MenuBackdrop;
+//# sourceMappingURL=MenuBackdrop.d.ts.map

package/_shared/components/InternalListActions/components/MenuBackdrop.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuBackdrop.d.ts","sourceRoot":"","sources":["../../../../../src/_shared/components/InternalListActions/components/MenuBackdrop.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,UAAU,iBAAiB;IACzB,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAED,QAAA,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAa7C,CAAC;AAEF,eAAe,YAAY,CAAC"}

package/_shared/components/InternalListActions/components/MenuItem.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+import { ActionItem } from '../types';
+interface MenuItemProps {
+    action: ActionItem;
+    onClick: (action: ActionItem) => void;
+}
+declare const MenuItem: React.FC<MenuItemProps>;
+export default MenuItem;
+//# sourceMappingURL=MenuItem.d.ts.map

package/_shared/components/InternalListActions/components/MenuItem.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuItem.d.ts","sourceRoot":"","sources":["../../../../../src/_shared/components/InternalListActions/components/MenuItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,UAAU,EAAE,MAAM,UAAU,CAAC;AAEtC,UAAU,aAAa;IACrB,MAAM,EAAE,UAAU,CAAC;IACnB,OAAO,EAAE,CAAC,MAAM,EAAE,UAAU,KAAK,IAAI,CAAC;CACvC;AAED,QAAA,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CAgCrC,CAAC;AAEF,eAAe,QAAQ,CAAC"}

package/_shared/components/InternalListActions/components/MenuList.d.ts

@@ -0,0 +1,16 @@
+import React from 'react';
+import { ActionItem } from '../types';
+interface MenuListProps {
+    menuRef: React.RefObject<HTMLUListElement>;
+    actions: ActionItem[];
+    position: 'bottom-left' | 'bottom-right' | 'top-left' | 'top-right';
+    isClosing: boolean;
+    isSwipeMode: boolean;
+    onActionClick: (action: ActionItem) => void;
+    onClose: () => void;
+    onDragHandleKeyDown: (e: React.KeyboardEvent) => void;
+    triggerElement?: HTMLElement | null;
+}
+declare const MenuList: React.FC<MenuListProps>;
+export default MenuList;
+//# sourceMappingURL=MenuList.d.ts.map

package/_shared/components/InternalListActions/components/MenuList.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuList.d.ts","sourceRoot":"","sources":["../../../../../src/_shared/components/InternalListActions/components/MenuList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAoC,MAAM,OAAO,CAAC;AAGzD,OAAO,EAAE,UAAU,EAAE,MAAM,UAAU,CAAC;AAItC,UAAU,aAAa;IACrB,OAAO,EAAE,KAAK,CAAC,SAAS,CAAC,gBAAgB,CAAC,CAAC;IAC3C,OAAO,EAAE,UAAU,EAAE,CAAC;IACtB,QAAQ,EAAE,aAAa,GAAG,cAAc,GAAG,UAAU,GAAG,WAAW,CAAC;IACpE,SAAS,EAAE,OAAO,CAAC;IACnB,WAAW,EAAE,OAAO,CAAC;IACrB,aAAa,EAAE,CAAC,MAAM,EAAE,UAAU,KAAK,IAAI,CAAC;IAC5C,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,mBAAmB,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,aAAa,KAAK,IAAI,CAAC;IACtD,cAAc,CAAC,EAAE,WAAW,GAAG,IAAI,CAAC;CACrC;AAED,QAAA,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CA0FrC,CAAC;AAEF,eAAe,QAAQ,CAAC"}

package/_shared/components/InternalListActions/components/TriggerButton.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+interface TriggerButtonProps {
+    triggerRef: React.RefObject<HTMLButtonElement>;
+    disabled: boolean;
+    isOpen: boolean;
+    isSwipeGesture: boolean;
+    onClick: () => void;
+}
+declare const TriggerButton: React.FC<TriggerButtonProps>;
+export default TriggerButton;
+//# sourceMappingURL=TriggerButton.d.ts.map

package/_shared/components/InternalListActions/components/TriggerButton.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TriggerButton.d.ts","sourceRoot":"","sources":["../../../../../src/_shared/components/InternalListActions/components/TriggerButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,UAAU,kBAAkB;IAC1B,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC,iBAAiB,CAAC,CAAC;IAC/C,QAAQ,EAAE,OAAO,CAAC;IAClB,MAAM,EAAE,OAAO,CAAC;IAChB,cAAc,EAAE,OAAO,CAAC;IACxB,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAED,QAAA,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CAyC/C,CAAC;AAEF,eAAe,aAAa,CAAC"}

package/_shared/components/InternalListActions/components/index.d.ts

@@ -0,0 +1,6 @@
+export { default as MenuBackdrop } from './MenuBackdrop';
+export { default as DragHandle } from './DragHandle';
+export { default as MenuItem } from './MenuItem';
+export { default as MenuList } from './MenuList';
+export { default as TriggerButton } from './TriggerButton';
+//# sourceMappingURL=index.d.ts.map

package/_shared/components/InternalListActions/components/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/_shared/components/InternalListActions/components/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,gBAAgB,CAAC;AACzD,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,cAAc,CAAC;AACrD,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,YAAY,CAAC;AACjD,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,YAAY,CAAC;AACjD,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC"}

package/_shared/components/InternalListActions/constants.d.ts

@@ -0,0 +1,5 @@
+export declare const MOBILE_BREAKPOINT = 768;
+export declare const CLOSE_ANIMATION_DURATION = 300;
+export declare const SWIPE_THRESHOLD = 50;
+export declare const VERTICAL_TOLERANCE = 30;
+//# sourceMappingURL=constants.d.ts.map

package/_shared/components/InternalListActions/constants.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["../../../../src/_shared/components/InternalListActions/constants.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,iBAAiB,MAAM,CAAC;AACrC,eAAO,MAAM,wBAAwB,MAAM,CAAC;AAC5C,eAAO,MAAM,eAAe,KAAK,CAAC;AAClC,eAAO,MAAM,kBAAkB,KAAK,CAAC"}

package/_shared/components/InternalListActions/hooks/index.d.ts

@@ -0,0 +1,3 @@
+export { default as useSwipeGesture } from './useSwipeGesture';
+export { default as useClickOutside } from './useClickOutside';
+//# sourceMappingURL=index.d.ts.map

package/_shared/components/InternalListActions/hooks/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/_shared/components/InternalListActions/hooks/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAC/D,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,mBAAmB,CAAC"}

package/_shared/components/InternalListActions/hooks/useClickOutside.d.ts

@@ -0,0 +1,3 @@
+declare const useClickOutside: (ref: React.RefObject<HTMLElement>, isOpen: boolean, onClickOutside: () => void, menuRef?: React.RefObject<HTMLElement>) => void;
+export default useClickOutside;
+//# sourceMappingURL=useClickOutside.d.ts.map

package/_shared/components/InternalListActions/hooks/useClickOutside.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useClickOutside.d.ts","sourceRoot":"","sources":["../../../../../src/_shared/components/InternalListActions/hooks/useClickOutside.ts"],"names":[],"mappings":"AAEA,QAAA,MAAM,eAAe,GACnB,KAAK,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,EACjC,QAAQ,OAAO,EACf,gBAAgB,MAAM,IAAI,EAC1B,UAAU,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,KACrC,IAwBF,CAAC;AAEF,eAAe,eAAe,CAAC"}

package/_shared/components/InternalListActions/hooks/useSwipeGesture.d.ts

@@ -0,0 +1,3 @@
+declare const useSwipeGesture: (triggerRef: React.RefObject<HTMLButtonElement>, isSwipeMode: boolean, isOpen: boolean, onSwipeLeft: () => void) => void;
+export default useSwipeGesture;
+//# sourceMappingURL=useSwipeGesture.d.ts.map

package/_shared/components/InternalListActions/hooks/useSwipeGesture.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSwipeGesture.d.ts","sourceRoot":"","sources":["../../../../../src/_shared/components/InternalListActions/hooks/useSwipeGesture.ts"],"names":[],"mappings":"AAGA,QAAA,MAAM,eAAe,GACnB,YAAY,KAAK,CAAC,SAAS,CAAC,iBAAiB,CAAC,EAC9C,aAAa,OAAO,EACpB,QAAQ,OAAO,EACf,aAAa,MAAM,IAAI,KACtB,IA6DF,CAAC;AAEF,eAAe,eAAe,CAAC"}

package/_shared/components/InternalListActions/index.d.ts

@@ -0,0 +1,4 @@
+export { default } from './InternalListActions';
+export { default as InternalListActions } from './InternalListActions';
+export type { ActionItem, InternalListActionsProps } from './types';
+//# sourceMappingURL=index.d.ts.map

package/_shared/components/InternalListActions/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/_shared/components/InternalListActions/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;AAChD,OAAO,EAAE,OAAO,IAAI,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AACvE,YAAY,EAAE,UAAU,EAAE,wBAAwB,EAAE,MAAM,SAAS,CAAC"}

package/_shared/components/InternalListActions/types.d.ts

@@ -0,0 +1,15 @@
+import { ComponentPropsWithoutRef } from 'react';
+export type ActionItem = {
+    label: string;
+    onClick: () => void;
+    icon?: React.ReactNode;
+    disabled?: boolean;
+    variant?: 'default' | 'positive' | 'warning' | 'negative' | 'neutral';
+};
+export type InternalListActionsProps = {
+    actions: ActionItem[];
+    disabled?: boolean;
+    position?: 'bottom-left' | 'bottom-right' | 'top-left' | 'top-right';
+    actionType?: 'menu' | 'swipe';
+} & Omit<ComponentPropsWithoutRef<'div'>, 'children'>;
+//# sourceMappingURL=types.d.ts.map

package/_shared/components/InternalListActions/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/_shared/components/InternalListActions/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,wBAAwB,EAAE,MAAM,OAAO,CAAC;AAEjD,MAAM,MAAM,UAAU,GAAG;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,QAAQ,CAAC,EAAE,OAAO,CAAC;IAInB,OAAO,CAAC,EAAE,SAAS,GAAG,UAAU,GAAG,SAAS,GAAG,UAAU,GAAG,SAAS,CAAC;CACvE,CAAC;AAEF,MAAM,MAAM,wBAAwB,GAAG;IAIrC,OAAO,EAAE,UAAU,EAAE,CAAC;IAItB,QAAQ,CAAC,EAAE,OAAO,CAAC;IAInB,QAAQ,CAAC,EAAE,aAAa,GAAG,cAAc,GAAG,UAAU,GAAG,WAAW,CAAC;IAOrE,UAAU,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;CAC/B,GAAG,IAAI,CAAC,wBAAwB,CAAC,KAAK,CAAC,EAAE,UAAU,CAAC,CAAC"}

package/index.es.js

@@ -46923,16 +46923,21 @@ CardListItem.displayName = 'CardListItem';
 var Options = function (_a) {
     var options = _a.options, selectedOptions = _a.selectedOptions, clearLabel = _a.clearLabel, filterLabel = _a.filterLabel, multiChoice = _a.multiChoice, onSelect = _a.onSelect, filterOptions = _a.filterOptions, clearOptions = _a.clearOptions;
     var columns = multiChoice ? Math.ceil(options.length / 5) : 1;
+    var isMultiArray = Array.isArray(selectedOptions);
     return (e.createElement("div", { className: "ods-chips__options", "data-testid": "ods-chips-option" },
         e.createElement("div", { className: classNames('ods-chips__options--content', "ods-chips__options--content--columns-".concat(columns)) }, options.map(function (_a) {
             var label = _a.label, value = _a.value;
-            return (e.createElement("button", { key: label, type: "button", value: value, onClick: function () { return onSelect(label, value); }, className: classNames('ods-chips__options--option', {
-                    'ods-chips__options--option--selected': !multiChoice &&
-                        !Array.isArray(selectedOptions) &&
-                        selectedOptions.value === value,
-                }) },
-                multiChoice && Array.isArray(selectedOptions) && (e.createElement(Checkbox, { checked: !!selectedOptions.find(function (option) { return option.value === value; }), readOnly: true })),
-                label));
+            if (multiChoice && isMultiArray) {
+                var isSelected_1 = selectedOptions.some(function (option) { return option.value === value; });
+                return (e.createElement("div", { key: value, className: classNames('ods-chips__options--option', 'ods-chips__options--option-container', {
+                        'ods-chips__options--option--selected': isSelected_1,
+                    }) },
+                    e.createElement(Checkbox, { checked: isSelected_1, id: "chips-option-".concat(value), onClick: function () { return onSelect(label, value); }, readOnly: true, label: label })));
+            }
+            var isSelected = !multiChoice && !isMultiArray && selectedOptions.value === value;
+            return (e.createElement("button", { key: value, type: "button", value: value, onClick: function () { return onSelect(label, value); }, className: classNames('ods-chips__options--option', {
+                    'ods-chips__options--option--selected': isSelected,
+                }) }, label));
         })),
         multiChoice && (e.createElement("div", { className: "ods-chips__options--footer" },
             e.createElement("button", { type: "button", onClick: clearOptions, className: "ods-btn ods-btn--sm ods-btn--text" }, clearLabel),