@onereach/ui-components 4.6.2-beta.2782.0 → 4.6.2

package/dist/esm/v3/{OrMenu-458e495d.js → OrMenu-8a53ccf9.js}

@@ -1,7 +1,5 @@
-import { defineComponent, ref, computed, toRef } from 'vue-demi';
-import '@vueuse/core';
-import { u as usePopoverState } from './usePopoverState-30ac6da1.js';
-import { s as script$1, P as PopoverPlacement } from './OrPopover-9bc36ad6.js';
+import { defineComponent, ref, computed } from 'vue-demi';
+import { s as script$1, P as PopoverPlacement } from './OrPopover-15c2968f.js';
 import { resolveComponent, openBlock, createBlock, withCtx, createElementVNode, mergeProps, withModifiers, renderSlot } from 'vue';
 
 const MenuRoot = [
@@ -17,10 +15,6 @@ var script = defineComponent({
   },
   inheritAttrs: false,
   props: {
-    isOpen: {
-      type: Boolean,
-      default: false
-    },
     trigger: {
       type: HTMLElement,
       default: undefined
@@ -30,36 +24,68 @@ var script = defineComponent({
       default: PopoverPlacement.Bottom
     }
   },
-  emits: ['update:state', 'open', 'close'],
-  expose: ['root', 'state', 'open', 'close', 'toggle'],
-  setup(props, context) {
+  emits: ['update:state'],
+  expose: ['root', 'state', 'isOpen', 'open', 'close', 'toggle'],
+  setup() {
     // Refs
     const root = ref();
+    const popover = ref();
+    const popoverRoot = computed(() => {
+      var _a;
+      return (_a = popover.value) === null || _a === void 0 ? void 0 : _a.root;
+    });
+    const popoverState = computed(() => {
+      var _a;
+      return (_a = popover.value) === null || _a === void 0 ? void 0 : _a.state;
+    });
     // Styles
     const rootStyles = computed(() => ['or-menu-v3', ...MenuRoot]);
     // State
-    const {
-      state,
-      open,
-      close,
-      toggle
-    } = usePopoverState(toRef(props, 'isOpen'), context);
+    const isOpen = computed(() => {
+      var _a;
+      return (_a = popover.value) === null || _a === void 0 ? void 0 : _a.isOpen;
+    });
+    // Methods
+    function open() {
+      const popoverInstance = popover.value;
+      if (popoverInstance) {
+        popoverInstance.open();
+      }
+    }
+    function close() {
+      const popoverInstance = popover.value;
+      if (popoverInstance) {
+        popoverInstance.close();
+      }
+    }
+    function toggle() {
+      isOpen.value ? close() : open();
+    }
     // Handlers
     function onClick(event) {
       const path = event.composedPath();
-      if (path.some(_ref => {
+      const classLists = path.filter(_ref => {
         let {
           classList
         } = _ref;
-        return classList === null || classList === void 0 ? void 0 : classList.contains('or-menu-item-v3');
-      })) {
+        return !!classList;
+      }).map(_ref2 => {
+        let {
+          classList
+        } = _ref2;
+        return classList;
+      });
+      if (classLists.some(classList => classList.contains('or-menu-item-v3'))) {
         close();
       }
     }
     return {
       root,
+      popover,
+      popoverRoot,
+      state: popoverState,
       rootStyles,
-      state,
+      isOpen,
       open,
       close,
       toggle,
@@ -71,13 +97,13 @@ var script = defineComponent({
 function render(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_OrPopover = resolveComponent("OrPopover");
   return openBlock(), createBlock(_component_OrPopover, {
-    "is-open": _ctx.state === 'open',
+    ref: "popover",
     variant: 'auto',
     trigger: _ctx.trigger,
     placement: _ctx.placement,
     "full-width": false,
     "disable-default-styles": false,
-    "onUpdate:state": _cache[1] || (_cache[1] = $event => _ctx.state = $event)
+    "onUpdate:state": _cache[1] || (_cache[1] = $event => _ctx.$emit('update:state', $event))
   }, {
     default: withCtx(() => [createElementVNode("div", mergeProps({
       ref: "root"
@@ -89,7 +115,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
     }), [renderSlot(_ctx.$slots, "default")], 16 /* FULL_PROPS */)]),
 
     _: 3 /* FORWARDED */
-  }, 8 /* PROPS */, ["is-open", "trigger", "placement"]);
+  }, 8 /* PROPS */, ["trigger", "placement"]);
 }
 
 script.render = render;

package/dist/esm/v3/OrModal-1366926a.js

@@ -0,0 +1,150 @@
+import { defineComponent, ref, computed, watch } from 'vue-demi';
+import { s as script$2 } from './OrIconButton-b7217ea5.js';
+import { s as script$1 } from './OrOverlay-bf72f582.js';
+import { resolveComponent, openBlock, createBlock, withCtx, createElementVNode, mergeProps, normalizeClass, renderSlot, createVNode, withModifiers, createCommentVNode } from 'vue';
+
+var ModalSize;
+(function (ModalSize) {
+  ModalSize["L"] = "l";
+  ModalSize["M"] = "m";
+  ModalSize["S"] = "s";
+})(ModalSize || (ModalSize = {}));
+
+const ModalRoot = [
+// Layout
+'layout-column',
+// Box
+'w-full', 'h-full md:h-auto md:max-h-[min(calc(100%-(2*theme(spacing.3xl))),772px)]',
+// Shape
+'md:rounded-md',
+// Spacing
+'py-md md:py-lg', 'gap-md md:gap-lg',
+// Typography
+'typography-body-2-regular',
+// Theme
+'theme-background-default', 'dark:theme-background-default-dark', 'theme-foreground-default', 'dark:theme-foreground-default-dark',
+// Elevation
+'shadow-modal', 'dark:shadow-modal-dark'];
+const ModalRootSizes = {
+  'l': [
+  // Box
+  'md:w-[1050px]'],
+  'm': [
+  // Box
+  'md:w-[700px]'],
+  's': [
+  // Box
+  'md:w-[480px]']
+};
+const ModalHeader = [
+// Layout
+'layout-row',
+// Spacing
+'px-md md:px-lg',
+// Typography
+'typography-headline-2'];
+const ModalContent = [
+// Box
+'grow', 'overflow-auto',
+// Spacing
+'px-md md:px-lg'];
+const ModalFooter = [
+// Spacing
+'px-md md:px-lg'];
+
+var script = defineComponent({
+  name: 'OrModal',
+  components: {
+    OrOverlay: script$1,
+    OrIconButton: script$2
+  },
+  inheritAttrs: false,
+  props: {
+    size: {
+      type: String,
+      default: ModalSize.M
+    },
+    isOpen: {
+      type: Boolean,
+      default: false
+    }
+  },
+  emits: ['open', 'close'],
+  expose: ['root', 'isActive', 'open', 'close'],
+  setup(props, context) {
+    // Refs
+    const root = ref();
+    // Styles
+    const rootStyles = computed(() => ['or-modal-v3', ...ModalRoot, ...ModalRootSizes[props.size]]);
+    const headerStyles = computed(() => [...ModalHeader]);
+    const contentStyles = computed(() => [...ModalContent]);
+    const footerStyles = computed(() => [...ModalFooter]);
+    // State
+    const isActive = ref(false);
+    // Events
+    watch(isActive, value => {
+      context.emit(value ? 'open' : 'close');
+    });
+    watch(() => props.isOpen, newIsOpen => {
+      if (newIsOpen) {
+        open();
+      } else {
+        close();
+      }
+    }, {
+      immediate: true
+    });
+    // Methods
+    function open() {
+      isActive.value = true;
+    }
+    function close() {
+      isActive.value = false;
+    }
+    return {
+      root,
+      rootStyles,
+      headerStyles,
+      contentStyles,
+      footerStyles,
+      isActive,
+      open,
+      close
+    };
+  }
+});
+
+const _hoisted_1 = {
+  class: /*#__PURE__*/normalizeClass(['grow'])
+};
+function render(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_OrIconButton = resolveComponent("OrIconButton");
+  const _component_OrOverlay = resolveComponent("OrOverlay");
+  return _ctx.isActive ? (openBlock(), createBlock(_component_OrOverlay, {
+    key: 0,
+    fullscreen: true
+  }, {
+    default: withCtx(() => [createElementVNode("div", mergeProps({
+      ref: "root"
+    }, _ctx.$attrs, {
+      class: _ctx.rootStyles
+    }), [createElementVNode("div", {
+      class: normalizeClass(_ctx.headerStyles)
+    }, [createElementVNode("div", _hoisted_1, [renderSlot(_ctx.$slots, "header")]), createVNode(_component_OrIconButton, {
+      icon: 'close',
+      size: 'l',
+      onClick: withModifiers(_ctx.close, ["stop"])
+    }, null, 8 /* PROPS */, ["onClick"])], 2 /* CLASS */), createElementVNode("div", {
+      class: normalizeClass(_ctx.contentStyles)
+    }, [renderSlot(_ctx.$slots, "default")], 2 /* CLASS */), createElementVNode("div", {
+      class: normalizeClass(_ctx.footerStyles)
+    }, [renderSlot(_ctx.$slots, "footer")], 2 /* CLASS */)], 16 /* FULL_PROPS */)]),
+
+    _: 3 /* FORWARDED */
+  })) : createCommentVNode("v-if", true);
+}
+
+script.render = render;
+script.__file = "src/components/or-modal-v3/OrModal.vue";
+
+export { ModalSize as M, script as s };

package/dist/esm/v3/{OrModal-03ad23ea.js → OrModal-f3a4813a.js}

@@ -1,6 +1,6 @@
 import { defineComponent, ref, watch, onBeforeUnmount } from 'vue-demi';
-import './OrButton-e44f6f03.js';
-import { s as script$1 } from './OrIconButton-440b9f36.js';
+import './OrButton-78a118d7.js';
+import { s as script$1 } from './OrIconButton-ad0cbc8d.js';
 import { s as script$2 } from './OrOverlay-451dce49.js';
 import { onClickOutside } from '@vueuse/core';
 import { useFocusTrap } from '@vueuse/integrations/useFocusTrap';

package/dist/esm/v3/{OrNotification-cdbd93bc.js → OrNotification-09216b8b.js}

@@ -1,5 +1,5 @@
 import { defineComponent, ref, computed } from 'vue-demi';
-import { s as script$2 } from './OrIconButton-3d1ffea6.js';
+import { s as script$2 } from './OrIconButton-b7217ea5.js';
 import { s as script$1 } from './OrIcon-62793572.js';
 import { resolveComponent, openBlock, createElementBlock, normalizeClass, createElementVNode, createVNode, renderSlot, createBlock, withModifiers, createCommentVNode } from 'vue';
 

package/dist/esm/v3/{OrNotification-69eff848.js → OrNotification-538f8e92.js}

@@ -1,7 +1,7 @@
 import { defineComponent } from 'vue-demi';
 import { s as script$1 } from './OrIcon-d8ea7901.js';
-import './OrButton-e44f6f03.js';
-import { s as script$2 } from './OrIconButton-440b9f36.js';
+import './OrButton-78a118d7.js';
+import { s as script$2 } from './OrIconButton-ad0cbc8d.js';
 import { resolveComponent, openBlock, createElementBlock, normalizeClass, createElementVNode, renderSlot, createVNode, Fragment, createTextVNode, toDisplayString, createCommentVNode, createBlock } from 'vue';
 import { s as styleInject } from './style-inject.es-4c6f2515.js';
 

package/dist/esm/v3/{OrOverflowMenu-40bdbf02.js → OrOverflowMenu-4d0bf63a.js}

@@ -1,7 +1,7 @@
 import { defineComponent, ref } from 'vue-demi';
 import { useToggle, onClickOutside } from '@vueuse/core';
-import { s as script$2 } from './OrButton-e44f6f03.js';
-import { s as script$3 } from './OrIconButton-440b9f36.js';
+import { s as script$2 } from './OrButton-78a118d7.js';
+import { s as script$3 } from './OrIconButton-ad0cbc8d.js';
 import { resolveComponent, openBlock, createElementBlock, createVNode, withModifiers, createElementVNode, renderSlot, createBlock, withCtx, Fragment, renderList, createCommentVNode } from 'vue';
 import { s as styleInject } from './style-inject.es-4c6f2515.js';
 import { s as script$4, O as OrFloatingPlacements } from './OrFloating-1a9ccfe9.js';

package/dist/esm/v3/{OrOverlay-28952099.js → OrOverlay-bf72f582.js}

@@ -1,6 +1,6 @@
 import { useScrollLock } from '@vueuse/core';
 import { defineComponent, ref, computed } from 'vue-demi';
-import { u as useElevation } from './useElevation-a50ec347.js';
+import { u as useElevation } from './useElevation-b5a49746.js';
 import { s as script$1 } from './OrTeleport.vue3-8099178c.js';
 import { resolveComponent, openBlock, createBlock, withCtx, createElementVNode, mergeProps, renderSlot } from 'vue';
 

package/dist/esm/v3/{OrPagination-ad365d85.js → OrPagination-c6046af4.js}

@@ -4,8 +4,8 @@ import { u as useResponsive } from './useResponsive-a02e95b7.js';
 import { s as script$1 } from './OrButton-c2b6aa9e.js';
 import { s as script$2 } from './OrIcon-62793572.js';
 import { s as script$4 } from './OrMenuItem-dbee450f.js';
-import { s as script$3 } from './OrMenu-458e495d.js';
-import './OrPopover-9bc36ad6.js';
+import { s as script$3 } from './OrMenu-8a53ccf9.js';
+import './OrPopover-15c2968f.js';
 import { resolveComponent, openBlock, createElementBlock, normalizeClass, createElementVNode, createVNode, withModifiers, withCtx, Fragment, renderList, createBlock, createTextVNode, toDisplayString, createCommentVNode } from 'vue';
 
 const PaginationRoot = [
@@ -250,7 +250,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
     onClick: _cache[2] || (_cache[2] = withModifiers($event => _ctx.limitMenu.open(), ["stop"]))
   }, {
     default: withCtx(() => [createTextVNode(toDisplayString(_ctx.currentLimit) + " ", 1 /* TEXT */), createVNode(_component_OrIcon, {
-      icon: _ctx.limitMenu && _ctx.limitMenu.state === 'open' ? 'arrow_drop_up' : 'arrow_drop_down'
+      icon: _ctx.limitMenu && _ctx.limitMenu.isOpen ? 'arrow_drop_up' : 'arrow_drop_down'
     }, null, 8 /* PROPS */, ["icon"])]),
     _: 1 /* STABLE */
   }, 8 /* PROPS */, ["class"]), createVNode(_component_OrMenu, {

package/dist/esm/v3/{OrPassword-42208c82.js → OrPassword-9192b9ea.js}

@@ -2,8 +2,8 @@ import { defineComponent, ref } from 'vue-demi';
 import { useVModel } from '@vueuse/core';
 import { s as script$1 } from './OrInput-9be9a209.js';
 import { u as useToggle } from './useToggle-c04fc920.js';
-import './OrButton-e44f6f03.js';
-import { s as script$2, b as BUTTON_SIZE } from './OrIconButton-440b9f36.js';
+import './OrButton-78a118d7.js';
+import { s as script$2, b as BUTTON_SIZE } from './OrIconButton-ad0cbc8d.js';
 import { resolveComponent, openBlock, createBlock, createSlots, withCtx, createVNode, renderSlot } from 'vue';
 import { s as styleInject } from './style-inject.es-4c6f2515.js';
 

package/dist/esm/v3/{OrPopover-9bc36ad6.js → OrPopover-15c2968f.js}

@@ -1,10 +1,9 @@
-import { autoUpdate, computePosition, shift, flip, hide } from '@floating-ui/dom';
+import { autoUpdate, computePosition, flip, shift, hide } from '@floating-ui/dom';
 import { onClickOutside } from '@vueuse/core';
-import { defineComponent, ref, computed, toRef, watchPostEffect, unref } from 'vue-demi';
-import { u as useElevation } from './useElevation-a50ec347.js';
-import { u as usePopoverState } from './usePopoverState-30ac6da1.js';
+import { defineComponent, ref, computed, watch, watchPostEffect, unref, toRef, nextTick } from 'vue-demi';
+import { u as useElevation } from './useElevation-b5a49746.js';
 import { u as useResponsive } from './useResponsive-a02e95b7.js';
-import { s as script$1 } from './OrBottomSheet-348fe528.js';
+import { s as script$1 } from './OrBottomSheet-5969a217.js';
 import { s as script$2 } from './OrTeleport.vue3-8099178c.js';
 import { resolveComponent, openBlock, createBlock, withCtx, withDirectives, createElementVNode, createElementBlock, mergeProps, renderSlot, normalizeClass, createCommentVNode, vShow } from 'vue';
 
@@ -81,10 +80,6 @@ var script = defineComponent({
   },
   inheritAttrs: false,
   props: {
-    isOpen: {
-      type: Boolean,
-      default: false
-    },
     variant: {
       type: String,
       default: PopoverVariant.Auto
@@ -114,8 +109,8 @@ var script = defineComponent({
       default: false
     }
   },
-  emits: ['update:state', 'open', 'close'],
-  expose: ['root', 'state', 'isFlipped', 'isHidden', 'open', 'close', 'toggle'],
+  emits: ['update:state', 'update:state:open', 'update:state:fullscreen', 'update:state:closed', 'update:state:closed-automatically'],
+  expose: ['root', 'state', 'isOpen', 'isFullscreen', 'isClosed', 'isFlipped', 'open', 'close'],
   setup(props, context) {
     const {
       isDesktop,
@@ -132,14 +127,89 @@ var script = defineComponent({
     const rootStyles = computed(() => ['or-popover-v3', ...PopoverRoot, ...props.customStyles]);
     const bodyStyles = computed(() => [...PopoverBody, ...PopoverBodyPlacements[props.placement]]);
     // State
-    const {
-      state,
-      open,
-      close,
-      toggle
-    } = usePopoverState(toRef(props, 'isOpen'), context);
+    const state = ref('closed');
+    const isOpen = computed(() => state.value === 'open');
+    const isFullscreen = computed(() => state.value === 'fullscreen');
+    const isClosed = computed(() => state.value === 'closed');
     const isFlipped = ref(false);
-    const isHidden = ref(false);
+    // Events
+    watch(state, value => {
+      context.emit('update:state', value);
+      switch (value) {
+        case 'open':
+          context.emit('update:state:open');
+          break;
+        case 'fullscreen':
+          context.emit('update:state:fullscreen');
+          break;
+        case 'closed':
+          context.emit('update:state:closed');
+          break;
+      }
+    });
+    // Methods
+    function open() {
+      state.value = 'open';
+      switch (props.variant) {
+        case PopoverVariant.Auto:
+          if (isMobile.value) {
+            nextTick(() => {
+              const bottomSheetInstance = bottomSheet.value;
+              if (bottomSheetInstance) {
+                bottomSheetInstance.open();
+              }
+            });
+          }
+          break;
+        case PopoverVariant.Popover:
+          break;
+        case PopoverVariant.BottomSheet:
+          nextTick(() => {
+            const bottomSheetInstance = bottomSheet.value;
+            if (bottomSheetInstance) {
+              bottomSheetInstance.open();
+            }
+          });
+          break;
+      }
+    }
+    function close() {
+      let auto = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
+      state.value = 'closed';
+      switch (props.variant) {
+        case PopoverVariant.Auto:
+          if (isMobile.value) {
+            nextTick(() => {
+              const bottomSheetInstance = bottomSheet.value;
+              if (bottomSheetInstance) {
+                bottomSheetInstance.close();
+              }
+            });
+          }
+          break;
+        case PopoverVariant.Popover:
+          break;
+        case PopoverVariant.BottomSheet:
+          nextTick(() => {
+            const bottomSheetInstance = bottomSheet.value;
+            if (bottomSheetInstance) {
+              bottomSheetInstance.close();
+            }
+          });
+          break;
+      }
+      if (auto) {
+        context.emit('update:state:closed-automatically');
+      }
+    }
+    // Handlers
+    function handleBottomSheetState(bottomSheetState) {
+      if (bottomSheetState === 'closed') {
+        state.value = 'closed';
+      } else {
+        state.value = 'open';
+      }
+    }
     // Effects
     watchPostEffect(() => {
       const rootElement = unref(root);
@@ -150,14 +220,14 @@ var script = defineComponent({
         } = props;
         if (trigger) {
           autoUpdate(trigger, rootElement, async () => {
-            var _a, _b;
+            var _a;
             const {
               x,
               y,
               middlewareData
             } = await computePosition(trigger, rootElement, {
               placement,
-              middleware: [shift(), flip(), hide()]
+              middleware: [flip(), shift(), hide()]
             });
             Object.assign(rootElement.style, {
               left: `${x}px`,
@@ -166,14 +236,10 @@ var script = defineComponent({
               width: props.fullWidth ? `${trigger.offsetWidth}px` : ''
             });
             isFlipped.value = Boolean((_a = middlewareData.flip) === null || _a === void 0 ? void 0 : _a.index);
-            isHidden.value = Boolean((_b = middlewareData.hide) === null || _b === void 0 ? void 0 : _b.referenceHidden);
           });
         }
       }
     });
-    // #region Elevation
-    useElevation(root, state);
-    // #endregion
     // #region Click Outside
     const trigger = toRef(props, 'trigger');
     onClickOutside(root, event => {
@@ -184,26 +250,31 @@ var script = defineComponent({
         } = _ref;
         return (classList === null || classList === void 0 ? void 0 : classList.contains('or-popover-v3')) || (classList === null || classList === void 0 ? void 0 : classList.contains('or-bottom-sheet-v3'));
       })) {
-        close();
+        close(true);
       }
     }, {
       ignore: [trigger]
     });
     // #endregion
+    // #region Elevation
+    useElevation(root, state);
+    // #endregion
     return {
       isDesktop,
       isMobile,
       root,
       bottomSheet,
       bottomSheetRoot,
+      handleBottomSheetState,
       rootStyles,
       bodyStyles,
       state,
+      isOpen,
+      isFullscreen,
+      isClosed,
       isFlipped,
-      isHidden,
       open,
-      close,
-      toggle
+      close
     };
   }
 });
@@ -229,12 +300,12 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
       key: 1,
       ref: "bottomSheet"
     }, _ctx.bottomSheetProps, {
-      "is-open": _ctx.state === 'open',
-      "onUpdate:state": _cache[0] || (_cache[0] = $event => _ctx.state = $event)
+      "onUpdate:state": _cache[0] || (_cache[0] = $event => _ctx.state = $event),
+      "onUpdate:state:closedAutomatically": _cache[1] || (_cache[1] = $event => _ctx.$emit('update:state:closed-automatically'))
     }), {
       default: withCtx(() => [renderSlot(_ctx.$slots, "default")]),
       _: 3 /* FORWARDED */
-    }, 16 /* FULL_PROPS */, ["is-open"])) : createCommentVNode("v-if", true)], 512 /* NEED_PATCH */), [[vShow, _ctx.state === 'open']])]),
+    }, 16 /* FULL_PROPS */)) : createCommentVNode("v-if", true)], 512 /* NEED_PATCH */), [[vShow, _ctx.isOpen]])]),
     _: 3 /* FORWARDED */
   });
 }

package/dist/esm/v3/{OrSearch-cdb1eeb4.js → OrSearch-d0c8aca7.js}

@@ -1,8 +1,8 @@
 import { defineComponent, ref } from 'vue-demi';
 import { s as script$1 } from './OrInput-9be9a209.js';
 import { debouncedWatch } from '@vueuse/core';
-import './OrButton-e44f6f03.js';
-import { s as script$2, b as BUTTON_SIZE } from './OrIconButton-440b9f36.js';
+import './OrButton-78a118d7.js';
+import { s as script$2, b as BUTTON_SIZE } from './OrIconButton-ad0cbc8d.js';
 import { resolveComponent, openBlock, createBlock, createSlots, withCtx, createVNode, normalizeStyle, renderSlot } from 'vue';
 import { s as styleInject } from './style-inject.es-4c6f2515.js';
 

package/dist/esm/v3/{OrSearch-ad1a1b36.js → OrSearch-ecad7638.js}

@@ -1,6 +1,6 @@
 import { debouncedWatch } from '@vueuse/core';
 import { defineComponent, ref, computed, watch } from 'vue-demi';
-import { s as script$1 } from './OrInput-2e83e367.js';
+import { s as script$1 } from './OrInput-af5bb98a.js';
 import { I as InputBoxSize } from './OrInputBox-ba40bbdf.js';
 import { resolveComponent, openBlock, createBlock, normalizeClass } from 'vue';
 

package/dist/esm/v3/{OrSelect-24937c69.js → OrSelect-60205145.js}

@@ -1,6 +1,6 @@
 import { defineComponent, ref } from 'vue-demi';
 import { onClickOutside } from '@vueuse/core';
-import { i as isEmpty, s as script$c } from './OrLoader-7d0021b7.js';
+import { i as isEmpty, s as script$c } from './OrLoader-7b006619.js';
 import { s as script$a } from './OrIcon-d8ea7901.js';
 import keyBy from 'lodash/keyBy';
 import { s as script$9 } from './OrChip-857982e0.js';

package/dist/esm/v3/{OrSelect-04f5014d.js → OrSelect-cfb336db.js}

@@ -2,17 +2,17 @@ import { defineComponent, getCurrentInstance, ref, computed, onMounted, watch }
 import { D as DropdownClose, a as DropdownOpen } from './dropdown-open-e1f90e0a.js';
 import { u as useOverflow } from './useOverflow-c856b7b7.js';
 import '@vueuse/core';
-import { s as script$1 } from './OrCheckbox-56d7b6eb.js';
+import { s as script$1, i as isEmptyValue } from './OrCheckbox-7093e9c2.js';
 import { s as script$2 } from './OrError-c01d0c29.js';
 import { s as script$3 } from './OrExpansionPanel-c016d8fa.js';
 import { s as script$4 } from './OrHint-06ab89d7.js';
 import { s as script$5 } from './OrIcon-62793572.js';
 import { s as script$7, I as InputBoxSize } from './OrInputBox-ba40bbdf.js';
-import { s as script$6 } from './OrInput-2e83e367.js';
+import { s as script$6 } from './OrInput-af5bb98a.js';
 import { s as script$8 } from './OrLabel-4da56db0.js';
 import { s as script$9 } from './OrMenuItem-dbee450f.js';
-import { s as script$a } from './OrPopover-9bc36ad6.js';
-import { s as script$b } from './OrTag-fb9d3047.js';
+import { s as script$a } from './OrPopover-15c2968f.js';
+import { s as script$b } from './OrTag-8605e9e6.js';
 import { resolveComponent, resolveDirective, openBlock, createElementBlock, normalizeClass, createBlock, withCtx, renderSlot, createTextVNode, toDisplayString, createCommentVNode, withDirectives, createElementVNode, Fragment, renderList, createVNode, withModifiers, vShow } from 'vue';
 
 const SelectRoot = [
@@ -200,6 +200,9 @@ var script = defineComponent({
         context.emit('update:modelValue', value);
       }
     });
+    const isEmptyModelValue = computed(() => {
+      return Array.isArray(proxyModelValue.value) ? proxyModelValue.value.length === 0 : isEmptyValue(proxyModelValue.value);
+    });
     onMounted(() => {
       if (!proxyModelValue.value && props.multiple) {
         proxyModelValue.value = [];
@@ -289,6 +292,7 @@ var script = defineComponent({
       controlId,
       proxyModelValue,
       readonly,
+      isEmptyModelValue,
       selection,
       searchText,
       internalSearchOptions,
@@ -382,7 +386,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
       class: normalizeClass(_ctx.placeholderStyles)
     }, toDisplayString(_ctx.placeholder), 3 /* TEXT, CLASS */))]) : (openBlock(), createElementBlock(Fragment, {
       key: 1
-    }, [_ctx.proxyModelValue ? renderSlot(_ctx.$slots, "valueTemplate", {
+    }, [!_ctx.isEmptyModelValue ? renderSlot(_ctx.$slots, "valueTemplate", {
       key: 0,
       model: _ctx.proxyModelValue
     }, () => [createElementVNode("span", _hoisted_2, toDisplayString(_ctx.selection.label), 1 /* TEXT */)]) : (openBlock(), createElementBlock("span", {

package/dist/esm/v3/{OrSidebar-20aaf94a.js → OrSidebar-1579ad80.js}

@@ -1,6 +1,6 @@
 import { useDraggable, useElementBounding } from '@vueuse/core';
 import { defineComponent, ref, computed, useSlots, watch } from 'vue-demi';
-import { O as OrSidebarPlacement, s as script$1 } from './OrSidebarCollapseButton-8d1f1bd0.js';
+import { O as OrSidebarPlacement, s as script$1 } from './OrSidebarCollapseButton-2668946c.js';
 import { resolveComponent, openBlock, createElementBlock, normalizeClass, renderSlot, createCommentVNode, createElementVNode, normalizeStyle, createBlock, withDirectives, vShow } from 'vue';
 
 const SidebarRoot = [