@wix/entity-advanced-permissions 1.1422.0 → 1.1423.0

package/dist/statics/entity-advanced-permissions.umd.js

@@ -34679,7 +34679,7 @@ var __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_DEFINE_RESULT__;/*!
 /******/ 	
 /******/ 	/* webpack/runtime/publicPath */
 /******/ 	(() => {
-/******/ 		__webpack_require__.p = "https://static.parastorage.com/services/entity-advanced-permissions/2d3c9f417fccd2d8cf1a6f97d92b2559fe9a858751e61d49b7832f58/";
+/******/ 		__webpack_require__.p = "https://static.parastorage.com/services/entity-advanced-permissions/35fbe31f90b9e6b03bec0eea24c498f8fb3769eff353f660d067e57a/";
 /******/ 	})();
 /******/ 	
 /******/ 	/* webpack/runtime/jsonp chunk loading */
@@ -34783,7 +34783,7 @@ var __webpack_exports__ = {};
 (() => {
 "use strict";
 /*!********************************!*\
-  !*** ./index.ts + 565 modules ***!
+  !*** ./index.ts + 566 modules ***!
   \********************************/
 // ESM COMPAT FLAG
 __webpack_require__.r(__webpack_exports__);
@@ -35710,7 +35710,7 @@ if(false /* HMR */) // removed by dead control flow
 {}
 
 ;// ../../../node_modules/@wix/design-system/dist/esm/utils/versionedNamespace.js
-const placeholder = 'wds_1_334_0';
+const placeholder = 'wds_1_338_0';
 const versionedNamespace = placeholder.startsWith('wds_')
     ? placeholder
     : '';
@@ -40791,15 +40791,7 @@ const useEventCallback = (fn) => {
     }, []);
 };
 //# sourceMappingURL=useEventCallback.js.map
-;// ../../../node_modules/@wix/design-system/dist/esm/Tooltip/Tooltip.js
-
-
-
-
-
-
-
-
+;// ../../../node_modules/@wix/design-system/dist/esm/utils/containsNativelyInteractive.js
 const isNativelyInteractive = (element) => {
     if (!element.hasAttribute('tabindex')) {
         return element.tabIndex >= 0;
@@ -40808,6 +40800,11 @@ const isNativelyInteractive = (element) => {
     probe.removeAttribute('tabindex');
     return probe.tabIndex >= 0;
 };
+/**
+ * Whether `target`, or an ancestor below `boundary`, is interactive on its own
+ * (a button, a link, a form field). An element that is focusable only through
+ * a `tabindex` attribute does not count.
+ */
 const containsNativelyInteractive = (target, boundary) => {
     for (let element = target; element && element !== boundary; element = element.parentElement) {
         if (isNativelyInteractive(element)) {
@@ -40816,6 +40813,17 @@ const containsNativelyInteractive = (target, boundary) => {
     }
     return false;
 };
+//# sourceMappingURL=containsNativelyInteractive.js.map
+;// ../../../node_modules/@wix/design-system/dist/esm/Tooltip/Tooltip.js
+
+
+
+
+
+
+
+
+
 const Tooltip = (0,external_React_.forwardRef)((componentProps, ref) => {
     const { onShow = () => ({}), onHide = () => ({}), size = 'medium', className, placement = 'top', exitDelay = FALLBACK_EXIT_DELAY, enterDelay = FALLBACK_ENTER_DELAY, moveArrowTo, appendTo = 'window', flip = true, fixed = false, maxWidth = 204, fluid, moveBy, disabled, children, zIndex = ZIndex.tooltip, textAlign = 'start', content = '', inline, 'aria-describedby': ariaDescribedBy, 'aria-labelledby': ariaLabelledBy, interactive = true, ...rest } = useDefaultProps('Tooltip', componentProps);
     const [shown, setShown] = (0,external_React_.useState)(false);
@@ -45159,15 +45167,22 @@ const Ticker_constants_dataHooks = {
 
 
 
-const Ticker = ({ onUp, onDown, upDisabled, downDisabled, onMouseDown, dataHook, }) => (external_React_default().createElement(InputConsumer, { consumerCompName: Ticker.displayName }, ({ disabled, readOnly, size }) => {
-    const isUpDisabled = upDisabled || disabled || readOnly;
-    const isDownDisabled = downDisabled || disabled || readOnly;
-    return (external_React_default().createElement("div", { className: Ticker_classes_classes.root({ size }), onMouseDown: onMouseDown, "data-hook": dataHook },
-        external_React_default().createElement("div", { "data-hook": Ticker_constants_dataHooks.tickerUp, "data-disabled": isUpDisabled, className: Ticker_classes_classes.up({ disabled: isUpDisabled }), onClick: isUpDisabled ? undefined : onUp },
-            external_React_default().createElement(FormFieldSpinnerUp_default, null)),
-        external_React_default().createElement("div", { "data-hook": Ticker_constants_dataHooks.tickerDown, "data-disabled": isDownDisabled, className: Ticker_classes_classes.down({ disabled: isDownDisabled }), onClick: isDownDisabled ? undefined : onDown },
-            external_React_default().createElement(FormFieldSpinnerDown_default, null))));
-}));
+
+const Ticker = ({ onUp, onDown, upDisabled, downDisabled, onMouseDown, dataHook, }) => {
+    const icons = useIcons('InputTicker', {
+        FormFieldSpinnerUp: FormFieldSpinnerUp_default,
+        FormFieldSpinnerDown: FormFieldSpinnerDown_default,
+    });
+    return (external_React_default().createElement(InputConsumer, { consumerCompName: Ticker.displayName }, ({ disabled, readOnly, size }) => {
+        const isUpDisabled = upDisabled || disabled || readOnly;
+        const isDownDisabled = downDisabled || disabled || readOnly;
+        return (external_React_default().createElement("div", { className: Ticker_classes_classes.root({ size }), onMouseDown: onMouseDown, "data-hook": dataHook },
+            external_React_default().createElement("div", { "data-hook": Ticker_constants_dataHooks.tickerUp, "data-disabled": isUpDisabled, className: Ticker_classes_classes.up({ disabled: isUpDisabled }), onClick: isUpDisabled ? undefined : onUp },
+                external_React_default().createElement(icons.FormFieldSpinnerUp, null)),
+            external_React_default().createElement("div", { "data-hook": Ticker_constants_dataHooks.tickerDown, "data-disabled": isDownDisabled, className: Ticker_classes_classes.down({ disabled: isDownDisabled }), onClick: isDownDisabled ? undefined : onDown },
+                external_React_default().createElement(icons.FormFieldSpinnerDown, null))));
+    }));
+};
 Ticker.displayName = 'Input.Ticker';
 
 //# sourceMappingURL=Ticker.js.map
@@ -45380,12 +45395,7 @@ var FormFieldErrorFilled_default = FormFieldErrorFilled;
 
 
 
-const statusToIconMap = {
-    success: external_React_default().createElement(FormFieldSuccessFilled_default, null),
-    warning: external_React_default().createElement(FormFieldWarningFilled_default, null),
-    loading: external_React_default().createElement(Loader, { size: "tiny" }),
-    error: external_React_default().createElement(FormFieldErrorFilled_default, null),
-};
+
 const StatusIndicator = (props) => {
     const { dataHook, status = STATUS.ERROR, message, tooltipPlacement = TOOLTIP_PLACEMENT.TOP, className, tooltipProps, } = props;
     (0,external_React_.useEffect)(() => {
@@ -45394,6 +45404,17 @@ const StatusIndicator = (props) => {
         }
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, []);
+    const icons = useIcons('StatusIndicator', {
+        FormFieldSuccessFilled: FormFieldSuccessFilled_default,
+        FormFieldWarningFilled: FormFieldWarningFilled_default,
+        FormFieldErrorFilled: FormFieldErrorFilled_default,
+    });
+    const statusToIconMap = {
+        success: external_React_default().createElement(icons.FormFieldSuccessFilled, null),
+        warning: external_React_default().createElement(icons.FormFieldWarningFilled, null),
+        loading: external_React_default().createElement(Loader, { size: "tiny" }),
+        error: external_React_default().createElement(icons.FormFieldErrorFilled, null),
+    };
     const icon = statusToIconMap[status];
     const renderIcon = () => {
         if (message) {
@@ -62857,6 +62878,7 @@ const Drawer = ({ open, backdrop = true, renderBackdrop = true, resizable = true
     const contentRef = (0,external_React_.useRef)(null);
     const handleRef = (0,external_React_.useRef)(null);
     const restingY = (0,external_React_.useRef)(0);
+    const outsideReason = (0,external_React_.useRef)('outside-press');
     const dragState = (0,external_React_.useRef)({
         isDragging: false,
         startY: 0,
@@ -62990,7 +63012,7 @@ const Drawer = ({ open, backdrop = true, renderBackdrop = true, resizable = true
         const visibleHeight = contentHeight - currentY;
         const lowestSnap = resolvedSnaps[0];
         if (dismissible && visibleHeight < lowestSnap * 0.5) {
-            animateToY(currentY, contentHeight, () => onClose(false));
+            animateToY(currentY, contentHeight, () => onClose(false, 'drag'));
             return;
         }
         let nearest = resolvedSnaps[0];
@@ -63083,16 +63105,24 @@ const Drawer = ({ open, backdrop = true, renderBackdrop = true, resizable = true
             onHandlePointerUp();
         }
     };
-    const handleDismiss = (e) => {
+    const handleEscapeKeyDown = (e) => {
         e.preventDefault();
         if (!dismissible)
             return;
         const el = contentRef.current;
         if (!el) {
-            onClose(false);
+            onClose(false, 'escape-key');
+            return;
+        }
+        animateToY(restingY.current, getSize(el), () => onClose(false, 'escape-key'));
+    };
+    const handleInteractOutside = (e) => {
+        if (!dismissible) {
+            e.preventDefault();
             return;
         }
-        animateToY(restingY.current, getSize(el), () => onClose(false));
+        outsideReason.current =
+            e.detail.originalEvent.type === 'focusin' ? 'focus-out' : 'outside-press';
     };
     const lastAnimatedElRef = (0,external_React_.useRef)(null);
     const handleContentRef = (0,external_React_.useCallback)((el) => {
@@ -63116,10 +63146,10 @@ const Drawer = ({ open, backdrop = true, renderBackdrop = true, resizable = true
             orientation: axis === 'Y' ? 'horizontal' : 'vertical',
         }), "data-hook": Drawer_constants_DATA_HOOKS.HANDLE, onPointerDown: onHandlePointerDown, onPointerMove: onHandlePointerMove, onPointerUp: onHandlePointerUp }));
     return (external_React_default().createElement("div", { ref: rootRef, "data-hook": dataHook },
-        external_React_default().createElement(react_dialog_dist_Root, { open: open, onOpenChange: onClose, modal: modal },
+        external_React_default().createElement(react_dialog_dist_Root, { open: open, onOpenChange: isOpen => onClose(isOpen, outsideReason.current), modal: modal },
             external_React_default().createElement(react_dialog_dist_Portal, null,
                 renderBackdrop && (external_React_default().createElement(Overlay, { "data-hook": Drawer_constants_DATA_HOOKS.OVERLAY, className: Drawer_classes_classes.overlay({ backdrop }), style: { zIndex } })),
-                external_React_default().createElement(dist_Content, { ref: handleContentRef, "data-hook": Drawer_constants_DATA_HOOKS.CONTENT, "aria-modal": "true", "aria-labelledby": ariaLabelledBy, role: role, className: Drawer_classes_classes.content({ margin, resizable, anchor }), onInteractOutside: dismissible ? undefined : e => e.preventDefault(), onEscapeKeyDown: handleDismiss, onPointerDown: resizable ? onContentPointerDown : undefined, onPointerMove: resizable ? onContentPointerMove : undefined, onPointerUp: resizable ? onContentPointerUp : undefined, style: {
+                external_React_default().createElement(dist_Content, { ref: handleContentRef, "data-hook": Drawer_constants_DATA_HOOKS.CONTENT, "aria-modal": "true", "aria-labelledby": ariaLabelledBy, role: role, className: Drawer_classes_classes.content({ margin, resizable, anchor }), onInteractOutside: handleInteractOutside, onEscapeKeyDown: handleEscapeKeyDown, onPointerDown: resizable ? onContentPointerDown : undefined, onPointerMove: resizable ? onContentPointerMove : undefined, onPointerUp: resizable ? onContentPointerUp : undefined, style: {
                         zIndex,
                     } },
                     external_React_default().createElement(dist_Title, { className: Drawer_classes_classes.title() }),
@@ -63962,11 +63992,24 @@ class DropdownBase extends external_React_.PureComponent {
                 activeDescendantId: this._dropdownLayoutRef?.getActiveDescendentElementId(),
             });
         };
-        this._handleOutsideClick = (_, reason) => {
-            if (reason === 'outside-press') {
-                this._setIsOpen(false, reason);
+        this._handlePopoverOpenChange = (_, reason) => {
+            if (reason !== 'outside-press' && reason !== 'escape-key') {
                 return;
             }
+            if (reason === 'outside-press') {
+                this._close();
+            }
+            this.props.onClose?.(reason);
+        };
+        this._handleDrawerClose = (_, reason) => {
+            this._close();
+            if (reason === 'outside-press') {
+                this._handleClickOutside();
+            }
+            // The drawer is modal, so focus can't leave it.
+            if (reason !== 'focus-out') {
+                this.props.onClose?.(reason);
+            }
         };
         this._isDialogMode = () => {
             /** This component has two modes:
@@ -64043,8 +64086,8 @@ class DropdownBase extends external_React_.PureComponent {
             : children;
         return (external_React_default().createElement(WixDesignSystemContext.Consumer, null, ({ mobile }) => mobile ? (external_React_default().createElement("div", null,
             external_React_default().createElement("div", null, this._renderChildren(renderedTrigger)),
-            external_React_default().createElement(Drawer, { dataHook: dataHook, open: Boolean(open), onClose: isOpen => this._setIsOpen(isOpen), zIndex: zIndex },
-                external_React_default().createElement("div", { className: DropdownBase_classes_classes.drawerContent() }, this._renderDropdownLayout())))) : (external_React_default().createElement(PopoverNext, { dataListType: listType, onOpenChange: this._handleOutsideClick, animate: animate, dataHook: dataHook, open: open, autoUpdateOptions: { animationFrame: true }, ...popoverProps, placement: placement, dynamicWidth: dynamicWidth, appendTo: appendTo, showArrow: showArrow, zIndex: zIndex, moveBy: moveBy, onKeyDown: this._handleKeyDown, onMouseEnter: onMouseEnter ||
+            external_React_default().createElement(Drawer, { dataHook: dataHook, open: Boolean(open), onClose: this._handleDrawerClose, zIndex: zIndex },
+                external_React_default().createElement("div", { className: DropdownBase_classes_classes.drawerContent() }, this._renderDropdownLayout())))) : (external_React_default().createElement(PopoverNext, { dataListType: listType, onOpenChange: this._handlePopoverOpenChange, animate: animate, dataHook: dataHook, open: open, autoUpdateOptions: { animationFrame: true }, ...popoverProps, placement: placement, dynamicWidth: dynamicWidth, appendTo: appendTo, showArrow: showArrow, zIndex: zIndex, moveBy: moveBy, onKeyDown: this._handleKeyDown, onMouseEnter: onMouseEnter ||
                 !!(external_React_default().isValidElement(renderedTrigger) &&
                     renderedTrigger.props.onMouseEnter)
                 ? () => this._handlePopoverMouseEnter(renderedTrigger)
@@ -64243,12 +64286,16 @@ function withErrorBoundary(component, errorBoundaryProps) {
 ;// ../../../node_modules/@wix/wix-ui-icons-common/dist/esm/core/fetcher.js
 const ABORT_SIGNAL_TIMEOUT = 5e3;
 let sanitizer;
-const loadSanitizer = () => sanitizer ?? (sanitizer = __webpack_require__.e(/*! import() */ 500).then(__webpack_require__.bind(__webpack_require__, /*! ./sanitize.js */ 7500)).catch((error) => {
-  sanitizer = void 0;
-  throw error;
-}));
-loadSanitizer().catch(() => {
-});
+const importSanitizer = () => Promise.resolve().then(() => __webpack_require__.e(/*! import() */ 500).then(__webpack_require__.bind(__webpack_require__, /*! ./sanitize.js */ 7500)));
+const loadSanitizer = () => {
+  if (!sanitizer) {
+    sanitizer = importSanitizer().catch(importSanitizer).catch((error) => {
+      sanitizer = void 0;
+      throw error;
+    });
+  }
+  return sanitizer;
+};
 const isTransientError = (error) => error instanceof Error && (error.name === "TimeoutError" || error.name === "AbortError");
 function createTimeoutSignal(timeout) {
   if (typeof AbortSignal.timeout === "function") {
@@ -77419,10 +77466,11 @@ const IconButton = (0,external_React_.forwardRef)((props, ref) => {
     const { button: buttonPropsDefaults } = defaultOverrides;
     const { skin = 'standard', className, priority = 'primary', size = buttonPropsDefaults.size, children, disabled = false, dataHook, ariaLabel, ariaLabelledBy, ...rest } = useDefaultProps('IconButton', props);
     const childSize = ICON_CHILD_SIZE[size];
-    return (external_React_default().createElement(WrappedButtonCore, { ...rest, disabled: disabled, ref: buttonRef, className: IconButton_classes_classes.root({ skin, priority, size, disabled }, className, FocusRing_classes_classes.root()), ...generateDataAttr({
-            ...props,
-            size,
-        }, ['skin', 'size', 'priority']), "data-hook": dataHook, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy }, children &&
+    return (external_React_default().createElement(WrappedButtonCore, { ...rest, disabled: disabled, ref: buttonRef, className: IconButton_classes_classes.root({ skin, priority, size, disabled }, className, FocusRing_classes_classes.root()), ...generateDataAttr({ skin, size, priority }, [
+            'skin',
+            'size',
+            'priority',
+        ]), "data-hook": dataHook, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy }, children &&
         external_React_default().cloneElement(children, {
             size: childSize,
             width: childSize,
@@ -77432,13 +77480,21 @@ const IconButton = (0,external_React_.forwardRef)((props, ref) => {
 });
 IconButton.displayName = 'IconButton';
 //# sourceMappingURL=IconButton.js.map
-;// ../../../node_modules/@wix/design-system/dist/esm/Avatar/constants.js
-const avatarColorList = ['A1', 'A2', 'A3', 'A4', 'A5', 'A6', 'A7'];
-const avatarShapes = {
+;// ../../../node_modules/@wix/design-system/dist/esm/Avatar/Avatar.constants.js
+const AVATAR_COLORS = [
+    'A1',
+    'A2',
+    'A3',
+    'A4',
+    'A5',
+    'A6',
+    'A7',
+];
+const AVATAR_SHAPES = {
     circle: 'circle',
     square: 'square',
 };
-const Avatar_constants_dataHooks = {
+const Avatar_constants_DATA_HOOKS = {
     indication: 'avatar-indication',
     customIndication: 'avatar-customIndication',
     avatarCore: 'avatar-core',
@@ -77446,7 +77502,7 @@ const Avatar_constants_dataHooks = {
     loader: 'avatar-loader',
     textContainer: 'text-container',
 };
-//# sourceMappingURL=constants.js.map
+//# sourceMappingURL=Avatar.constants.js.map
 ;// ../../../node_modules/@wix/design-system/dist/esm/Avatar/Avatar.classes.js
 
 const Avatar_classes_classes = defineClassNames('avatar', {
@@ -77487,32 +77543,32 @@ const Avatar_classes_classes = defineClassNames('avatar', {
 ;// ../../../node_modules/@wix/design-system/dist/esm/Avatar/assets.js
 
 
-const personSvg = (external_React_default().createElement("svg", { className: Avatar_classes_classes.placeholder(), viewBox: "0 0 48 48", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
-    external_React_default().createElement("g", { clipPath: "url(#avatarPersonClip0)" },
-        external_React_default().createElement("g", { opacity: "0.5" },
-            external_React_default().createElement("g", { clipPath: "url(#avatarPersonClip1)" },
-                external_React_default().createElement("rect", { width: "48", height: "48", rx: "23.4032", fill: "var(--wds-illustration-color-6, #002294)" }),
-                external_React_default().createElement("g", { filter: "url(#avatarPersonBlur)" },
-                    external_React_default().createElement("path", { d: "M27.494 -18.5711C25.7001 -18.2145 23.9293 -17.7199 22.2045 -17.0872C15.1213 -14.4645 8.843 -9.4722 4.70346 -2.44384C-4.76 13.6029 0.506418 34.1589 16.4667 43.4649C32.4269 52.7708 53.0326 47.2954 62.4961 31.2486C71.9596 15.1904 66.6931 -5.36561 50.7444 -14.6601C43.4542 -18.9162 35.2096 -20.078 27.494 -18.5711Z", fill: "url(#avatarPersonGradient)" })))),
-        external_React_default().createElement("circle", { cx: "23.9999", cy: "19.2", r: "9.6", fill: "var(--wds-illustration-color-6, #002294)" }),
-        external_React_default().createElement("circle", { cx: "24", cy: "55.2", r: "24", fill: "var(--wds-illustration-color-6, #002294)" })),
-    external_React_default().createElement("defs", null,
-        external_React_default().createElement("filter", { id: "avatarPersonBlur", x: "-14.4", y: "-33.6", width: "96", height: "96", filterUnits: "userSpaceOnUse", colorInterpolationFilters: "sRGB" },
-            external_React_default().createElement("feFlood", { floodOpacity: "0", result: "BackgroundImageFix" }),
-            external_React_default().createElement("feBlend", { mode: "normal", in: "SourceGraphic", in2: "BackgroundImageFix", result: "shape" }),
-            external_React_default().createElement("feGaussianBlur", { stdDeviation: "7.2", result: "effect1_foregroundBlur" })),
-        external_React_default().createElement("linearGradient", { id: "avatarPersonGradient", x1: "57.6693", y1: "-13.1682", x2: "0.185771", y2: "60.1835", gradientUnits: "userSpaceOnUse" },
-            external_React_default().createElement("stop", { offset: "0.176006", stopColor: "var(--wds-illustration-color-5, #EAEFFF)" }),
-            external_React_default().createElement("stop", { offset: "0.576923", stopColor: "var(--wds-illustration-color-3, #B8C4FF)" }),
-            external_React_default().createElement("stop", { offset: "0.85", stopColor: "var(--wds-illustration-color-6, #002294)" })),
-        external_React_default().createElement("clipPath", { id: "avatarPersonClip0" },
-            external_React_default().createElement("rect", { width: "48", height: "48", rx: "24", fill: "white" })),
-        external_React_default().createElement("clipPath", { id: "avatarPersonClip1" },
-            external_React_default().createElement("rect", { width: "48", height: "48", rx: "23.4032", fill: "white" })))));
-const businessSvg = (external_React_default().createElement("svg", { className: Avatar_classes_classes.placeholder(), viewBox: "0 0 48 48" },
-    external_React_default().createElement("path", { d: "M21,13.387 C21,12.705 21.669,12.223 22.316,12.438 L22.316,12.438 L34.632,16.544 C35.449,16.816 36,17.581 36,18.441 L36,18.441 L36,34 L38,34 L38,36 L10,36 L10,34 L12,34 L12,21.659 C12,21.259 12.238,20.898 12.606,20.74 L12.606,20.74 L17.606,18.597 C18.266,18.314 19,18.799 19,19.517 L19,19.517 L19,34 L21,34 Z M32,29 L25,29 L25,31 L32,31 L32,29 Z M32,24 L25,24 L25,26 L32,26 L32,24 Z M32,19 L25,19 L25,21 L32,21 L32,19 Z" })));
-const smallBusinessSvg = (external_React_default().createElement("svg", { className: Avatar_classes_classes.placeholder(), viewBox: "0 0 24 24" },
-    external_React_default().createElement("path", { d: "M18,17 L18,8.754 C18,8.308 17.704,7.916 17.275,7.793 L11.637,6.182 C11.318,6.091 11,6.331 11,6.663 L11,17 L9,17 L9,8.934 C9,8.535 8.555,8.297 8.223,8.518 L6.223,9.852 C6.083,9.944 6,10.101 6,10.268 L6,17 L5,17 L5,18 L6,18 L9,18 L11,18 L18,18 L19,18 L19,17 L18,17 Z" })));
+const personSvg = (external_React_.createElement("svg", { className: Avatar_classes_classes.placeholder(), viewBox: "0 0 48 48", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
+    external_React_.createElement("g", { clipPath: "url(#avatarPersonClip0)" },
+        external_React_.createElement("g", { opacity: "0.5" },
+            external_React_.createElement("g", { clipPath: "url(#avatarPersonClip1)" },
+                external_React_.createElement("rect", { width: "48", height: "48", rx: "23.4032", fill: "var(--wds-illustration-color-6, #002294)" }),
+                external_React_.createElement("g", { filter: "url(#avatarPersonBlur)" },
+                    external_React_.createElement("path", { d: "M27.494 -18.5711C25.7001 -18.2145 23.9293 -17.7199 22.2045 -17.0872C15.1213 -14.4645 8.843 -9.4722 4.70346 -2.44384C-4.76 13.6029 0.506418 34.1589 16.4667 43.4649C32.4269 52.7708 53.0326 47.2954 62.4961 31.2486C71.9596 15.1904 66.6931 -5.36561 50.7444 -14.6601C43.4542 -18.9162 35.2096 -20.078 27.494 -18.5711Z", fill: "url(#avatarPersonGradient)" })))),
+        external_React_.createElement("circle", { cx: "23.9999", cy: "19.2", r: "9.6", fill: "var(--wds-illustration-color-6, #002294)" }),
+        external_React_.createElement("circle", { cx: "24", cy: "55.2", r: "24", fill: "var(--wds-illustration-color-6, #002294)" })),
+    external_React_.createElement("defs", null,
+        external_React_.createElement("filter", { id: "avatarPersonBlur", x: "-14.4", y: "-33.6", width: "96", height: "96", filterUnits: "userSpaceOnUse", colorInterpolationFilters: "sRGB" },
+            external_React_.createElement("feFlood", { floodOpacity: "0", result: "BackgroundImageFix" }),
+            external_React_.createElement("feBlend", { mode: "normal", in: "SourceGraphic", in2: "BackgroundImageFix", result: "shape" }),
+            external_React_.createElement("feGaussianBlur", { stdDeviation: "7.2", result: "effect1_foregroundBlur" })),
+        external_React_.createElement("linearGradient", { id: "avatarPersonGradient", x1: "57.6693", y1: "-13.1682", x2: "0.185771", y2: "60.1835", gradientUnits: "userSpaceOnUse" },
+            external_React_.createElement("stop", { offset: "0.176006", stopColor: "var(--wds-illustration-color-5, #EAEFFF)" }),
+            external_React_.createElement("stop", { offset: "0.576923", stopColor: "var(--wds-illustration-color-3, #B8C4FF)" }),
+            external_React_.createElement("stop", { offset: "0.85", stopColor: "var(--wds-illustration-color-6, #002294)" })),
+        external_React_.createElement("clipPath", { id: "avatarPersonClip0" },
+            external_React_.createElement("rect", { width: "48", height: "48", rx: "24", fill: "white" })),
+        external_React_.createElement("clipPath", { id: "avatarPersonClip1" },
+            external_React_.createElement("rect", { width: "48", height: "48", rx: "23.4032", fill: "white" })))));
+const businessSvg = (external_React_.createElement("svg", { className: Avatar_classes_classes.placeholder(), viewBox: "0 0 48 48" },
+    external_React_.createElement("path", { d: "M21,13.387 C21,12.705 21.669,12.223 22.316,12.438 L22.316,12.438 L34.632,16.544 C35.449,16.816 36,17.581 36,18.441 L36,18.441 L36,34 L38,34 L38,36 L10,36 L10,34 L12,34 L12,21.659 C12,21.259 12.238,20.898 12.606,20.74 L12.606,20.74 L17.606,18.597 C18.266,18.314 19,18.799 19,19.517 L19,19.517 L19,34 L21,34 Z M32,29 L25,29 L25,31 L32,31 L32,29 Z M32,24 L25,24 L25,26 L32,26 L32,24 Z M32,19 L25,19 L25,21 L32,21 L32,19 Z" })));
+const smallBusinessSvg = (external_React_.createElement("svg", { className: Avatar_classes_classes.placeholder(), viewBox: "0 0 24 24" },
+    external_React_.createElement("path", { d: "M18,17 L18,8.754 C18,8.308 17.704,7.916 17.275,7.793 L11.637,6.182 C11.318,6.091 11,6.331 11,6.663 L11,17 L9,17 L9,8.934 C9,8.535 8.555,8.297 8.223,8.518 L6.223,9.852 C6.083,9.944 6,10.101 6,10.268 L6,17 L5,17 L5,18 L6,18 L9,18 L11,18 L18,18 L19,18 L19,17 L18,17 Z" })));
 const placeholderSVGs = {
     size90: { circle: personSvg, square: businessSvg },
     size72: { circle: personSvg, square: businessSvg },
@@ -77529,20 +77585,20 @@ const placeholderSVGs = {
 /* stringToColor returns a different color for each string.
  ** Each string will ALWAYS receives the same color, so the color will always be consistent per string
  **/
-const stringToColor = name => {
+const stringToColor = (name) => {
     if (!name) {
         return;
     }
     const hash = stringToNumber(name);
-    const index = hash % avatarColorList.length; // this sets an index between 0 and array.length.
-    return avatarColorList[index];
+    const index = hash % AVATAR_COLORS.length; // this sets an index between 0 and array.length.
+    return AVATAR_COLORS[index];
 };
 /* stringToNumber creates a number for each string.
  ** for example the string: "Hi" number will be 177.
  ** charCode of "H" = 72, charCode of "i" = 105. 72 + 105 = 177
  ** This creates a unique number for each string
  **/
-const stringToNumber = str => str.split('').reduce((acc, char) => acc + char.charCodeAt(), 0);
+const stringToNumber = (str) => str.split('').reduce((acc, char) => acc + char.charCodeAt(0), 0);
 
 //# sourceMappingURL=string-to-color.js.map
 ;// ../../../node_modules/@wix/design-system/dist/esm/utils/propsUtils.js
@@ -77746,13 +77802,18 @@ const WrappedAvatarCore = Focusable_withFocusable(AvatarCore);
 
 
 
-const getSizeNumber = size => Number(size.substring(4));
+const getSizeNumber = (size) => Number(size.substring(4));
 const defaultSize = 48;
 const minSmallIconButton = 60;
+const DEFAULT_PROPS = {
+    size: 'size48',
+    shape: 'circle',
+    showIndicationOnHover: false,
+};
 /**
  * Avatar is a type of element that visually represents a user, either as an image, name initials or placeholder icon.
  */
-class Avatar_Avatar extends (external_React_default()).PureComponent {
+class Avatar_Avatar extends external_React_.PureComponent {
     constructor(props) {
         super(props);
         this._onMouseEnter = () => {
@@ -77772,7 +77833,7 @@ class Avatar_Avatar extends (external_React_default()).PureComponent {
         };
     }
     render() {
-        const { size, presence, indication, color, customIndication, onIndicationClick, dataHook, className, shape, text, placeholder, name, onClick, showIndicationOnHover, loading, ...rest } = this.props;
+        const { size = DEFAULT_PROPS.size, presence, indication, color, customIndication, onIndicationClick, dataHook, className, shape = DEFAULT_PROPS.shape, text, placeholder, name, onClick, showIndicationOnHover = DEFAULT_PROPS.showIndicationOnHover, loading, ...rest } = this.props;
         const { fadeIndication, showIndication } = this.state;
         const calculatedColor = color || stringToColor(text || name); // if color is provided as a prop use it, otherwise, generate a color based on the text
         const sizeNumber = getSizeNumber(size);
@@ -77781,8 +77842,8 @@ class Avatar_Avatar extends (external_React_default()).PureComponent {
         const renderIndication = indicationConstraints && !customIndication && indication;
         const renderCustomIndication = indicationConstraints && customIndication;
         const renderLoader = loading && sizeNumber >= defaultSize;
-        return (external_React_default().createElement("div", { "data-hook": dataHook, className: Avatar_classes_classes.root({}, className) },
-            external_React_default().createElement("div", { "data-hook": Avatar_constants_dataHooks.avatarWSR, onMouseEnter: this._onMouseEnter, onMouseLeave: this._onMouseLeave, className: Avatar_classes_classes.avatarContainer({
+        return (external_React_.createElement("div", { "data-hook": dataHook, className: Avatar_classes_classes.root({}, className) },
+            external_React_.createElement("div", { "data-hook": Avatar_constants_DATA_HOOKS.avatarWSR, onMouseEnter: this._onMouseEnter, onMouseLeave: this._onMouseLeave, className: Avatar_classes_classes.avatarContainer({
                     shape,
                     size,
                     indication: Boolean(customIndication || indication),
@@ -77791,29 +77852,25 @@ class Avatar_Avatar extends (external_React_default()).PureComponent {
                     clickable: !!onClick,
                     fade: fadeIndication,
                 }) },
-                external_React_default().createElement("div", { className: Avatar_classes_classes.coreAvatar() },
-                    external_React_default().createElement(WrappedAvatarCore, { ...rest, placeholder: placeholder ?? (external_React_default().createElement(AvatarDefaultPlaceholder, { shape: shape, size: size })), text: text, name: name, onClick: onClick, initialsLimit: sizeNumber < 24 ? 1 : undefined, "data-hook": Avatar_constants_dataHooks.avatarCore, className: Avatar_classes_classes.avatar({ color: calculatedColor }, FocusRing_classes_classes.root()) })),
+                external_React_.createElement("div", { className: Avatar_classes_classes.coreAvatar() },
+                    external_React_.createElement(WrappedAvatarCore, { ...rest, placeholder: placeholder ?? (external_React_.createElement(AvatarDefaultPlaceholder, { shape: shape, size: size })), text: text, name: name, onClick: onClick, initialsLimit: sizeNumber < 24 ? 1 : undefined, "data-hook": Avatar_constants_DATA_HOOKS.avatarCore, className: Avatar_classes_classes.avatar({ color: calculatedColor }, FocusRing_classes_classes.root()) })),
                 renderLoader && [
-                    external_React_default().createElement("div", { key: "overlay", className: Avatar_classes_classes.loaderContainer({}, Avatar_classes_classes.overlay()) }),
-                    external_React_default().createElement("div", { key: "loader", className: Avatar_classes_classes.loaderContainer({}, Avatar_classes_classes.loader()) },
-                        external_React_default().createElement(Loader, { dataHook: Avatar_constants_dataHooks.loader, size: "tiny" })),
+                    external_React_.createElement("div", { key: "overlay", className: Avatar_classes_classes.loaderContainer({}, Avatar_classes_classes.overlay()) }),
+                    external_React_.createElement("div", { key: "loader", className: Avatar_classes_classes.loaderContainer({}, Avatar_classes_classes.loader()) },
+                        external_React_.createElement(Loader, { dataHook: Avatar_constants_DATA_HOOKS.loader, size: "tiny" })),
                 ],
-                presence && external_React_default().createElement("div", { className: Avatar_classes_classes.presence() }),
-                renderIndication && (external_React_default().createElement("div", { className: Avatar_classes_classes.indication() },
-                    external_React_default().createElement(IconButton, { className: Avatar_classes_classes.iconButtonShadow(), dataHook: Avatar_constants_dataHooks.indication, skin: "light", onClick: onIndicationClick, shape: shape, size: sizeNumber > minSmallIconButton ? 'small' : 'tiny' }, indication))),
-                renderCustomIndication && (external_React_default().createElement("div", { className: Avatar_classes_classes.indication(), "data-hook": Avatar_constants_dataHooks.customIndication, onClick: onIndicationClick }, customIndication)))));
+                presence && external_React_.createElement("div", { className: Avatar_classes_classes.presence() }),
+                renderIndication && (external_React_.createElement("div", { className: Avatar_classes_classes.indication() },
+                    external_React_.createElement(IconButton, { className: Avatar_classes_classes.iconButtonShadow(), dataHook: Avatar_constants_DATA_HOOKS.indication, skin: "light", onClick: onIndicationClick, shape: shape, size: sizeNumber > minSmallIconButton ? 'small' : 'tiny' }, indication))),
+                renderCustomIndication && (external_React_.createElement("div", { className: Avatar_classes_classes.indication(), "data-hook": Avatar_constants_DATA_HOOKS.customIndication, onClick: onIndicationClick }, customIndication)))));
     }
 }
-Avatar_Avatar.contextType = WixDesignSystemContext;
-const AvatarDefaultPlaceholder = ({ shape, size }) => shape !== avatarShapes.square
-    ? placeholderSVGs[size][avatarShapes.circle]
-    : placeholderSVGs[size][avatarShapes.square];
 Avatar_Avatar.displayName = 'Avatar';
-Avatar_Avatar.defaultProps = {
-    size: 'size48',
-    shape: 'circle',
-    showIndicationOnHover: false,
-};
+Avatar_Avatar.contextType = WixDesignSystemContext;
+Avatar_Avatar.defaultProps = DEFAULT_PROPS;
+const AvatarDefaultPlaceholder = ({ shape, size, }) => shape !== AVATAR_SHAPES.square
+    ? placeholderSVGs[size][AVATAR_SHAPES.circle]
+    : placeholderSVGs[size][AVATAR_SHAPES.square];
 
 //# sourceMappingURL=Avatar.js.map
 ;// ./components/PermissionsList/Avatar.tsx