@wix/site-ui 1.30.0 → 1.31.0

package/dist/9352.js

@@ -0,0 +1,148 @@
+import { jsx } from "react/jsx-runtime";
+import { popupStateMapping, popupStateMapping_CommonPopupDataAttributes } from "./4388.js";
+import { transitionStatusMapping, useOpenChangeComplete } from "./880.js";
+import { useDialogPortalContext, useDialogRootContext } from "./6270.js";
+import { useRenderElement } from "./8272.js";
+import { FOCUSABLE_POPUP_PROPS } from "./8106.js";
+import { COMPOSITE_KEYS } from "./1500.js";
+import { FloatingFocusManager } from "./3485.js";
+import * as __rspack_external_react from "react";
+const stateAttributesMapping = {
+    ...popupStateMapping,
+    ...transitionStatusMapping
+};
+const DialogBackdrop_DialogBackdrop = /*#__PURE__*/ __rspack_external_react.forwardRef(function(componentProps, forwardedRef) {
+    const { render, className, style, forceRender = false, ...elementProps } = componentProps;
+    const { store } = useDialogRootContext();
+    const open = store.useState('open');
+    const nested = store.useState('nested');
+    const mounted = store.useState('mounted');
+    const transitionStatus = store.useState('transitionStatus');
+    const state = {
+        open,
+        transitionStatus
+    };
+    return useRenderElement('div', componentProps, {
+        state,
+        ref: [
+            store.context.backdropRef,
+            forwardedRef
+        ],
+        stateAttributesMapping: stateAttributesMapping,
+        props: [
+            {
+                role: 'presentation',
+                hidden: !mounted,
+                style: {
+                    userSelect: 'none',
+                    WebkitUserSelect: 'none'
+                }
+            },
+            elementProps
+        ],
+        enabled: forceRender || !nested
+    });
+});
+if ("production" !== process.env.NODE_ENV) DialogBackdrop_DialogBackdrop.displayName = "DialogBackdrop";
+let DialogPopupCssVars_DialogPopupCssVars = /*#__PURE__*/ function(DialogPopupCssVars) {
+    DialogPopupCssVars["nestedDialogs"] = "--nested-dialogs";
+    return DialogPopupCssVars;
+}({});
+let DialogPopupDataAttributes_DialogPopupDataAttributes = function(DialogPopupDataAttributes) {
+    DialogPopupDataAttributes[DialogPopupDataAttributes["open"] = popupStateMapping_CommonPopupDataAttributes.open] = "open";
+    DialogPopupDataAttributes[DialogPopupDataAttributes["closed"] = popupStateMapping_CommonPopupDataAttributes.closed] = "closed";
+    DialogPopupDataAttributes[DialogPopupDataAttributes["startingStyle"] = popupStateMapping_CommonPopupDataAttributes.startingStyle] = "startingStyle";
+    DialogPopupDataAttributes[DialogPopupDataAttributes["endingStyle"] = popupStateMapping_CommonPopupDataAttributes.endingStyle] = "endingStyle";
+    DialogPopupDataAttributes["nested"] = "data-nested";
+    DialogPopupDataAttributes["nestedDialogOpen"] = "data-nested-dialog-open";
+    return DialogPopupDataAttributes;
+}({});
+const DialogPopup_stateAttributesMapping = {
+    ...popupStateMapping,
+    ...transitionStatusMapping,
+    nestedDialogOpen (value) {
+        return value ? {
+            [DialogPopupDataAttributes_DialogPopupDataAttributes.nestedDialogOpen]: ''
+        } : null;
+    }
+};
+const DialogPopup_DialogPopup = /*#__PURE__*/ __rspack_external_react.forwardRef(function(componentProps, forwardedRef) {
+    const { render, className, style, finalFocus, initialFocus, ...elementProps } = componentProps;
+    const { store } = useDialogRootContext();
+    const descriptionElementId = store.useState("descriptionElementId");
+    const disablePointerDismissal = store.useState('disablePointerDismissal');
+    const floatingRootContext = store.useState('floatingRootContext');
+    const rootPopupProps = store.useState('popupProps');
+    const modal = store.useState('modal');
+    const mounted = store.useState('mounted');
+    const nested = store.useState('nested');
+    const nestedOpenDialogCount = store.useState('nestedOpenDialogCount');
+    const open = store.useState('open');
+    const openMethod = store.useState('openMethod');
+    const titleElementId = store.useState('titleElementId');
+    const transitionStatus = store.useState('transitionStatus');
+    const role = store.useState('role');
+    const floatingId = floatingRootContext.useState('floatingId');
+    const popupId = elementProps.id ?? floatingId;
+    useDialogPortalContext();
+    useOpenChangeComplete({
+        open,
+        ref: store.context.popupRef,
+        onComplete () {
+            if (open) store.context.onOpenChangeComplete?.(true);
+        }
+    });
+    function defaultInitialFocus(interactionType) {
+        if ('touch' === interactionType) return store.context.popupRef.current;
+        return true;
+    }
+    const resolvedInitialFocus = void 0 === initialFocus ? defaultInitialFocus : initialFocus;
+    const nestedDialogOpen = nestedOpenDialogCount > 0;
+    const setPopupElement = store.useStateSetter('popupElement');
+    const state = {
+        open,
+        nested,
+        transitionStatus,
+        nestedDialogOpen
+    };
+    const element = useRenderElement('div', componentProps, {
+        state,
+        props: [
+            rootPopupProps,
+            {
+                id: popupId,
+                'aria-labelledby': titleElementId ?? void 0,
+                'aria-describedby': descriptionElementId ?? void 0,
+                role,
+                ...FOCUSABLE_POPUP_PROPS,
+                hidden: !mounted,
+                onKeyDown (event) {
+                    if (COMPOSITE_KEYS.has(event.key)) event.stopPropagation();
+                },
+                style: {
+                    [DialogPopupCssVars_DialogPopupCssVars.nestedDialogs]: nestedOpenDialogCount
+                }
+            },
+            elementProps
+        ],
+        ref: [
+            forwardedRef,
+            store.context.popupRef,
+            setPopupElement
+        ],
+        stateAttributesMapping: DialogPopup_stateAttributesMapping
+    });
+    return /*#__PURE__*/ jsx(FloatingFocusManager, {
+        context: floatingRootContext,
+        openInteractionType: openMethod,
+        disabled: !mounted,
+        closeOnFocusOut: !disablePointerDismissal,
+        initialFocus: resolvedInitialFocus,
+        returnFocus: finalFocus,
+        modal: false !== modal,
+        restoreFocus: "popup",
+        children: element
+    });
+});
+if ("production" !== process.env.NODE_ENV) DialogPopup_DialogPopup.displayName = "DialogPopup";
+export { DialogBackdrop_DialogBackdrop, DialogPopup_DialogPopup };

package/dist/951.js

@@ -0,0 +1,22 @@
+import { EMPTY_ARRAY, useRenderElement, EMPTY_OBJECT } from "./8272.js";
+import { useCompositeItem } from "./2274.js";
+function CompositeItem(componentProps) {
+    const { render, className, style, state = EMPTY_OBJECT, props = EMPTY_ARRAY, refs = EMPTY_ARRAY, metadata, stateAttributesMapping, tag = 'div', ...elementProps } = componentProps;
+    const { compositeProps, compositeRef } = useCompositeItem({
+        metadata
+    });
+    return useRenderElement(tag, componentProps, {
+        state,
+        ref: [
+            ...refs,
+            compositeRef
+        ],
+        props: [
+            compositeProps,
+            ...props,
+            elementProps
+        ],
+        stateAttributesMapping
+    });
+}
+export { CompositeItem };

package/dist/9635.js

@@ -0,0 +1,22 @@
+import { useRenderElement } from "./8272.js";
+import * as __rspack_external_react from "react";
+const Separator = /*#__PURE__*/ __rspack_external_react.forwardRef(function(componentProps, forwardedRef) {
+    const { className, render, orientation = 'horizontal', style, ...elementProps } = componentProps;
+    const state = {
+        orientation
+    };
+    const element = useRenderElement('div', componentProps, {
+        state,
+        ref: forwardedRef,
+        props: [
+            {
+                role: 'separator',
+                'aria-orientation': orientation
+            },
+            elementProps
+        ]
+    });
+    return element;
+});
+if ("production" !== process.env.NODE_ENV) Separator.displayName = "Separator";
+export { Separator };

package/dist/9829.js

@@ -0,0 +1,4 @@
+function ownerDocument(node) {
+    return node?.ownerDocument || document;
+}
+export { ownerDocument };

package/dist/9863.js

@@ -0,0 +1,8 @@
+import * as __rspack_external_react from "react";
+const DirectionContext = /*#__PURE__*/ __rspack_external_react.createContext(void 0);
+if ("production" !== process.env.NODE_ENV) DirectionContext.displayName = "DirectionContext";
+function useDirection() {
+    const context = __rspack_external_react.useContext(DirectionContext);
+    return context?.direction ?? 'ltr';
+}
+export { useDirection };