@lion/ui 0.17.0 → 0.17.1

package/components/overlays/src/configurations/withDropdownConfig.js

@@ -1,24 +1,4 @@
-import { withClickInteraction } from './visibility-trigger-partials/withClickInteraction.js';
-
-/**
- * @typedef {import('../../types/OverlayConfig.js').OverlayConfig} OverlayConfig
- */
+import { withPopoverConfig } from './withPopoverConfig.js';
 
 export const withDropdownConfig = () =>
-  /** @type {OverlayConfig} */ ({
-    placementMode: 'local',
-    inheritsReferenceWidth: 'min',
-    hidesOnOutsideClick: true,
-    hidesOnEsc: true,
-    popperConfig: {
-      placement: 'bottom-start',
-      modifiers: [
-        {
-          name: 'offset',
-          enabled: false,
-        },
-      ],
-    },
-    handlesAccessibility: true,
-    ...withClickInteraction(),
-  });
+  withPopoverConfig({ horizontalFallback: false, placement: 'bottom-start' });

package/components/overlays/src/configurations/withPopoverConfig.js

@@ -0,0 +1,32 @@
+import { withClickInteraction } from './visibility-trigger-partials/withClickInteraction.js';
+
+/**
+ * @typedef {import('../../types/OverlayConfig.js').OverlayConfig} OverlayConfig
+ */
+
+export const withPopoverConfig = ({ horizontalFallback = true, placement = 'auto' } = {}) =>
+  /** @type {OverlayConfig} */ ({
+    placementMode: 'local',
+    inheritsReferenceWidth: 'min',
+    hidesOnOutsideClick: true,
+    hidesOnEsc: true,
+    popperConfig: {
+      placement,
+      modifiers: [
+        {
+          name: 'offset',
+          enabled: false,
+        },
+        {
+          name: 'flip',
+          options: {
+            fallbackPlacements: horizontalFallback
+              ? ['bottom', 'top', 'right', 'left']
+              : ['bottom', 'top'],
+          },
+        },
+      ],
+    },
+    handlesAccessibility: true,
+    ...withClickInteraction(),
+  });

package/custom-elements.json

@@ -1857,6 +1857,14 @@
             "module": "../components/overlays/src/configurations/withTooltipConfig.js"
           }
         },
+        {
+          "kind": "js",
+          "name": "withPopoverConfig",
+          "declaration": {
+            "name": "withPopoverConfig",
+            "module": "../components/overlays/src/configurations/withPopoverConfig.js"
+          }
+        },
         {
           "kind": "js",
           "name": "deepContains",
@@ -2158,36 +2166,6 @@
         }
       ]
     },
-    {
-      "kind": "javascript-module",
-      "path": "exports/define-helpers/sb-action-logger.js",
-      "declarations": [],
-      "exports": [
-        {
-          "kind": "custom-element-definition",
-          "name": "sb-action-logger",
-          "declaration": {
-            "name": "SbActionLogger",
-            "module": "/exports/helpers.js"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "exports/define-helpers/sb-locale-switcher.js",
-      "declarations": [],
-      "exports": [
-        {
-          "kind": "custom-element-definition",
-          "name": "sb-locale-switcher",
-          "declaration": {
-            "name": "SbLocaleSwitcher",
-            "module": "/exports/helpers.js"
-          }
-        }
-      ]
-    },
     {
       "kind": "javascript-module",
       "path": "exports/define/lion-accordion.js",
@@ -2893,6 +2871,36 @@
         }
       ]
     },
+    {
+      "kind": "javascript-module",
+      "path": "exports/define-helpers/sb-action-logger.js",
+      "declarations": [],
+      "exports": [
+        {
+          "kind": "custom-element-definition",
+          "name": "sb-action-logger",
+          "declaration": {
+            "name": "SbActionLogger",
+            "module": "/exports/helpers.js"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "exports/define-helpers/sb-locale-switcher.js",
+      "declarations": [],
+      "exports": [
+        {
+          "kind": "custom-element-definition",
+          "name": "sb-locale-switcher",
+          "declaration": {
+            "name": "SbLocaleSwitcher",
+            "module": "/exports/helpers.js"
+          }
+        }
+      ]
+    },
     {
       "kind": "javascript-module",
       "path": "components/accordion/src/LionAccordion.js",
@@ -123655,6 +123663,32 @@
         }
       ]
     },
+    {
+      "kind": "javascript-module",
+      "path": "components/overlays/src/configurations/withPopoverConfig.js",
+      "declarations": [
+        {
+          "kind": "function",
+          "name": "withPopoverConfig",
+          "parameters": [
+            {
+              "name": "{ horizontalFallback = true, placement = 'auto' }",
+              "default": "{}"
+            }
+          ]
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "withPopoverConfig",
+          "declaration": {
+            "name": "withPopoverConfig",
+            "module": "components/overlays/src/configurations/withPopoverConfig.js"
+          }
+        }
+      ]
+    },
     {
       "kind": "javascript-module",
       "path": "components/overlays/src/utils/deep-contains.js",

package/dist-types/components/overlays/src/configurations/withDropdownConfig.d.ts

@@ -1,3 +1,2 @@
 export function withDropdownConfig(): import("../../types/OverlayConfig.js").OverlayConfig;
-export type OverlayConfig = import('../../types/OverlayConfig.js').OverlayConfig;
 //# sourceMappingURL=withDropdownConfig.d.ts.map

package/dist-types/components/overlays/src/configurations/withDropdownConfig.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"withDropdownConfig.d.ts","sourceRoot":"","sources":["../../../../../components/overlays/src/configurations/withDropdownConfig.js"],"names":[],"mappings":"AAMO,2FAiBH;4BApBS,OAAO,8BAA8B,EAAE,aAAa"}
+{"version":3,"file":"withDropdownConfig.d.ts","sourceRoot":"","sources":["../../../../../components/overlays/src/configurations/withDropdownConfig.js"],"names":[],"mappings":"AAEO,2FACsE"}

package/dist-types/components/overlays/src/configurations/withPopoverConfig.d.ts

@@ -0,0 +1,6 @@
+export function withPopoverConfig({ horizontalFallback, placement }?: {
+    horizontalFallback?: boolean | undefined;
+    placement?: string | undefined;
+}): import("../../types/OverlayConfig.js").OverlayConfig;
+export type OverlayConfig = import('../../types/OverlayConfig.js').OverlayConfig;
+//# sourceMappingURL=withPopoverConfig.d.ts.map

package/dist-types/components/overlays/src/configurations/withPopoverConfig.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"withPopoverConfig.d.ts","sourceRoot":"","sources":["../../../../../components/overlays/src/configurations/withPopoverConfig.js"],"names":[],"mappings":"AAMO;;;yDAyBH;4BA5BS,OAAO,8BAA8B,EAAE,aAAa"}

package/dist-types/exports/overlays.d.ts

@@ -6,6 +6,7 @@ export { withBottomSheetConfig } from "../components/overlays/src/configurations
 export { withModalDialogConfig } from "../components/overlays/src/configurations/withModalDialogConfig.js";
 export { withDropdownConfig } from "../components/overlays/src/configurations/withDropdownConfig.js";
 export { withTooltipConfig } from "../components/overlays/src/configurations/withTooltipConfig.js";
+export { withPopoverConfig } from "../components/overlays/src/configurations/withPopoverConfig.js";
 export { deepContains } from "../components/overlays/src/utils/deep-contains.js";
 export { getDeepActiveElement } from "../components/core/src/getDeepActiveElement.js";
 export { getFocusableElements } from "../components/overlays/src/utils/get-focusable-elements.js";