@onereach/ui-components 8.1.1-beta.3637.0 → 8.2.0

package/dist/esm/v3/{OrDateTimePicker-e050b5fc.js → OrDateTimePicker-9d1275f9.js}

@@ -7,12 +7,12 @@ import '@onereach/styles/tailwind/plugins/core';
 import '@onereach/styles/tailwind.config.json';
 import { s as script$9 } from './OrError-69bd7f6a.js';
 import { s as script$a } from './OrHint-55d3de35.js';
-import { s as script$c } from './OrIconButton-98a2ab6c.js';
+import { s as script$c } from './OrIconButton-38032a99.js';
 import { s as script$b } from './OrIcon-8f6c9c29.js';
 import { s as script$d, I as InputBoxSize } from './OrInputBox-f0bac539.js';
 import { s as script$e } from './OrLabel-b826da04.js';
-import { s as script$f } from './OrPopover-3b07d49e.js';
-import { s as script$1, a as script$2, b as script$3, c as script$4, d as script$5, e as script$6, f as script$7, g as script$8 } from './OrDateTimePickerTimeSelect-ed31f8b3.js';
+import { s as script$f } from './OrPopover-062e78f6.js';
+import { s as script$1, a as script$2, b as script$3, c as script$4, d as script$5, e as script$6, f as script$7, g as script$8 } from './OrDateTimePickerTimeSelect-16af1cc9.js';
 import { D as DateTimePickerTimeFormat } from './getTimePlaceholder-13d5f743.js';
 import { g as getCurrentDate } from './getCurrentDate-046a888d.js';
 import { resolveComponent, resolveDirective, openBlock, createElementBlock, normalizeClass, createBlock, withCtx, renderSlot, createTextVNode, toDisplayString, createCommentVNode, withDirectives, withModifiers, createVNode, Fragment, createElementVNode } from 'vue';
@@ -138,8 +138,8 @@ var script = defineComponent({
     });
     // Styles
     const rootStyles = computed(() => ['or-date-time-picker-v3', ...DateTimePicker]);
-    const datePopoverStyles = computed(() => [...DateTimePickerDatePopover]);
-    const timePopoverStyles = computed(() => [...DateTimePickerTimePopover]);
+    const datePopoverStyles = computed(() => ['or-date-time-picker-date-popover-v3', ...DateTimePickerDatePopover]);
+    const timePopoverStyles = computed(() => ['or-date-time-picker-time-popover-v3', ...DateTimePickerTimePopover]);
     // State
     const initialValue = ref((_a = props.modelValue) !== null && _a !== void 0 ? _a : getCurrentDate());
     watch(() => props.modelValue, value => {
@@ -330,6 +330,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
     }, null, 8 /* PROPS */, ["modelValue", "format", "selected", "required", "readonly", "disabled"]), [[_directive_dropdown_open, _ctx.toggleTimePopover], [_directive_dropdown_close, _ctx.closeTimePopover]]), createVNode(_component_OrPopover, {
       ref: "datePopover",
       class: normalizeClass(_ctx.datePopoverStyles),
+      "custom-styles": _ctx.datePopoverStyles,
       variant: 'auto',
       "bottom-sheet-props": {
         variant: 'basic'
@@ -376,9 +377,10 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
         })
       }, null, 8 /* PROPS */, ["disabled"])]),
       _: 1 /* STABLE */
-    }, 8 /* PROPS */, ["class", "trigger"]), createVNode(_component_OrPopover, {
+    }, 8 /* PROPS */, ["class", "custom-styles", "trigger"]), createVNode(_component_OrPopover, {
       ref: "timePopover",
       class: normalizeClass(_ctx.timePopoverStyles),
+      "custom-styles": _ctx.timePopoverStyles,
       variant: 'auto',
       "bottom-sheet-props": {
         variant: 'basic'
@@ -422,7 +424,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
         })
       }, null, 8 /* PROPS */, ["disabled"])]),
       _: 1 /* STABLE */
-    }, 8 /* PROPS */, ["class", "trigger"]), _hoisted_1]),
+    }, 8 /* PROPS */, ["class", "custom-styles", "trigger"]), _hoisted_1]),
     _: 1 /* STABLE */
   }, 8 /* PROPS */, ["variant", "size", "invalid", "readonly", "disabled"])), [[_directive_dropdown_open, _ctx.toggleDatePopover], [_directive_dropdown_close, _ctx.closeDatePopover]]), !_ctx.error ? (openBlock(), createElementBlock(Fragment, {
     key: 1

package/dist/esm/v3/{OrDateTimePickerTimeSelect-ed31f8b3.js → OrDateTimePickerTimeSelect-16af1cc9.js}

@@ -8,11 +8,11 @@ import { g as getDatePlaceholder, f as formatDate, D as DateTimePickerTimeFormat
 import { openBlock, createElementBlock, normalizeClass, withModifiers, Fragment, createTextVNode, toDisplayString, resolveComponent, createElementVNode, renderList, createBlock, withCtx, createVNode, renderSlot, createCommentVNode } from 'vue';
 import { s as script$8 } from './OrButton-2e3a73fb.js';
 import { s as script$9 } from './OrLabel-b826da04.js';
-import { s as script$b } from './OrIconButton-98a2ab6c.js';
+import { s as script$b } from './OrIconButton-38032a99.js';
 import { s as script$a } from './OrIcon-8f6c9c29.js';
 import { s as script$d } from './OrMenuItem-c5d2a427.js';
-import { s as script$c } from './OrMenu-72844eb1.js';
-import './OrPopover-3b07d49e.js';
+import { s as script$c } from './OrMenu-33d89df4.js';
+import './OrPopover-062e78f6.js';
 
 const DateTimePickerDateControl = [
 // Layout

package/dist/esm/v3/{OrIconButton-98a2ab6c.js → OrIconButton-38032a99.js}

@@ -1,7 +1,7 @@
 import { defineComponent, ref, toRefs, computed, isVue3 } from 'vue-demi';
 import { s as script$1, I as IconSize, a as IconVariant } from './OrIcon-8f6c9c29.js';
-import { s as script$2 } from './OrTooltip-f6c7bd37.js';
-import './OrPopover-3b07d49e.js';
+import { s as script$2 } from './OrTooltip-df9d2f0a.js';
+import './OrPopover-062e78f6.js';
 import { resolveComponent, openBlock, createBlock, normalizeProps, guardReactiveProps, createSlots, withCtx, createElementVNode, mergeProps, toHandlers, createVNode, renderSlot } from 'vue';
 
 var IconButtonColor;

package/dist/esm/v3/{OrInlineInput-91303ec3.js → OrInlineInput-651c1227.js}

@@ -8,7 +8,7 @@ import '@onereach/styles/tailwind.config.json';
 import { u as useValidationAttributes } from './useValidationAttributes-d1abbe34.js';
 import { s as script$1 } from './OrError-69bd7f6a.js';
 import { s as script$2 } from './OrHint-55d3de35.js';
-import { s as script$3 } from './OrIconButton-98a2ab6c.js';
+import { s as script$3 } from './OrIconButton-38032a99.js';
 import { s as script$4, I as InlineInputBoxSize } from './OrInlineInputBox-01fb2cb2.js';
 import { resolveComponent, openBlock, createElementBlock, normalizeClass, createElementVNode, createVNode, withCtx, withDirectives, mergeProps, vModelDynamic, withModifiers, createCommentVNode, createBlock, createSlots, createTextVNode, toDisplayString, vShow } from 'vue';
 import { s as styleInject } from './style-inject.es-4c6f2515.js';

package/dist/esm/v3/{OrInlineTextarea-17704265.js → OrInlineTextarea-c5f65562.js}

@@ -8,7 +8,7 @@ import '@onereach/styles/tailwind.config.json';
 import { u as useValidationAttributes } from './useValidationAttributes-d1abbe34.js';
 import { s as script$1 } from './OrError-69bd7f6a.js';
 import { s as script$2 } from './OrHint-55d3de35.js';
-import { s as script$3 } from './OrIconButton-98a2ab6c.js';
+import { s as script$3 } from './OrIconButton-38032a99.js';
 import { s as script$4 } from './OrInlineInputBox-01fb2cb2.js';
 import { resolveComponent, openBlock, createElementBlock, normalizeClass, createElementVNode, createVNode, withCtx, withDirectives, mergeProps, vModelText, withModifiers, createCommentVNode, createBlock, createSlots, createTextVNode, toDisplayString, vShow } from 'vue';
 import { s as styleInject } from './style-inject.es-4c6f2515.js';

package/dist/esm/v3/{OrInput-2d8e1231.js → OrInput-16b5c1d9.js}

@@ -8,7 +8,7 @@ import '@onereach/styles/tailwind.config.json';
 import { u as useValidationAttributes } from './useValidationAttributes-d1abbe34.js';
 import { s as script$1 } from './OrError-69bd7f6a.js';
 import { s as script$2 } from './OrHint-55d3de35.js';
-import { s as script$4 } from './OrIconButton-98a2ab6c.js';
+import { s as script$4 } from './OrIconButton-38032a99.js';
 import { s as script$3 } from './OrIcon-8f6c9c29.js';
 import { s as script$5, I as InputBoxSize } from './OrInputBox-f0bac539.js';
 import { s as script$6 } from './OrLabel-b826da04.js';

package/dist/esm/v3/{OrList-6932ecec.js → OrList-69039d4c.js}

@@ -6,7 +6,7 @@ import './dom-aecadd9a.js';
 import { u as useProxyModelValue } from './useProxyModelValue-940010d2.js';
 import '@onereach/styles/tailwind/plugins/core';
 import '@onereach/styles/tailwind.config.json';
-import { s as script$1 } from './OrIconButton-98a2ab6c.js';
+import { s as script$1 } from './OrIconButton-38032a99.js';
 import { s as script$2 } from './OrLabel-b826da04.js';
 import { s as script$3 } from './OrListItem-2ed9a12f.js';
 import { resolveComponent, openBlock, createElementBlock, normalizeClass, renderSlot, normalizeProps, guardReactiveProps, createVNode, withCtx, createTextVNode, toDisplayString, createElementVNode, Fragment, renderList, createBlock, createCommentVNode } from 'vue';

package/dist/esm/v3/{OrMenu-72844eb1.js → OrMenu-33d89df4.js}

@@ -4,8 +4,8 @@ import './dom-aecadd9a.js';
 import { u as usePopoverState } from './usePopoverState-b92c698b.js';
 import '@onereach/styles/tailwind/plugins/core';
 import '@onereach/styles/tailwind.config.json';
-import { s as script$1, P as PopoverPlacement } from './OrPopover-3b07d49e.js';
-import { resolveComponent, openBlock, createBlock, withCtx, createElementVNode, mergeProps, withModifiers, renderSlot } from 'vue';
+import { s as script$1, P as PopoverPlacement } from './OrPopover-062e78f6.js';
+import { resolveComponent, openBlock, createBlock, normalizeClass, withCtx, createElementVNode, mergeProps, withModifiers, renderSlot } from 'vue';
 
 const Menu = [
 // Layout
@@ -48,6 +48,7 @@ var script = defineComponent({
     const root = ref();
     // Styles
     const rootStyles = computed(() => ['or-menu-v3', ...Menu]);
+    const popoverStyles = computed(() => ['or-menu-popover-v3']);
     // State
     const {
       state,
@@ -70,6 +71,7 @@ var script = defineComponent({
     return {
       root,
       rootStyles,
+      popoverStyles,
       state,
       open,
       close,
@@ -82,6 +84,8 @@ var script = defineComponent({
 function render(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_OrPopover = resolveComponent("OrPopover");
   return openBlock(), createBlock(_component_OrPopover, {
+    class: normalizeClass(_ctx.popoverStyles),
+    "custom-styles": _ctx.popoverStyles,
     "is-open": _ctx.state === 'open',
     variant: 'auto',
     trigger: _ctx.trigger,
@@ -97,7 +101,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
     }), [renderSlot(_ctx.$slots, "default")], 16 /* FULL_PROPS */)]),
 
     _: 3 /* FORWARDED */
-  }, 8 /* PROPS */, ["is-open", "trigger", "placement", "offset"]);
+  }, 8 /* PROPS */, ["class", "custom-styles", "is-open", "trigger", "placement", "offset"]);
 }
 
 script.render = render;

package/dist/esm/v3/{OrModal-5fd452ff.js → OrModal-f2db8685.js}

@@ -4,9 +4,9 @@ import './dom-aecadd9a.js';
 import { u as usePopoverState } from './usePopoverState-b92c698b.js';
 import '@onereach/styles/tailwind/plugins/core';
 import '@onereach/styles/tailwind.config.json';
-import { s as script$5 } from './OrOverlay-6269c33a.js';
+import { s as script$5 } from './OrOverlay-bd4f72c4.js';
 import { openBlock, createElementBlock, normalizeClass, renderSlot, resolveComponent, createElementVNode, createVNode, withModifiers, createBlock, withCtx, mergeProps, createCommentVNode } from 'vue';
-import { s as script$4 } from './OrIconButton-98a2ab6c.js';
+import { s as script$4 } from './OrIconButton-38032a99.js';
 
 const ModalContent = [
 // Overflow

package/dist/esm/v3/{OrNotification-f8ba45c4.js → OrNotification-23b6d790.js}

@@ -1,5 +1,5 @@
 import { defineComponent, ref, computed } from 'vue-demi';
-import { s as script$2 } from './OrIconButton-98a2ab6c.js';
+import { s as script$2 } from './OrIconButton-38032a99.js';
 import { s as script$1 } from './OrIcon-8f6c9c29.js';
 import { resolveComponent, openBlock, createElementBlock, normalizeClass, createElementVNode, createVNode, renderSlot, createBlock, withModifiers, createCommentVNode } from 'vue';
 

package/dist/esm/v3/{OrOverlay-6269c33a.js → OrOverlay-bd4f72c4.js}

@@ -4,7 +4,7 @@ import { u as useElevation } from './useElevation-a50ec347.js';
 import './dom-aecadd9a.js';
 import '@onereach/styles/tailwind/plugins/core';
 import '@onereach/styles/tailwind.config.json';
-import { s as script$1 } from './OrTeleport.vue3-8099178c.js';
+import { s as script$1 } from './OrTeleport.vue3-bf77eed4.js';
 import { resolveComponent, openBlock, createBlock, withCtx, createElementVNode, mergeProps, renderSlot } from 'vue';
 
 const Overlay = [

package/dist/esm/v3/{OrPagination-4a9074e0.js → OrPagination-71db1b93.js}

@@ -7,8 +7,8 @@ import '@onereach/styles/tailwind.config.json';
 import { s as script$1 } from './OrButton-2e3a73fb.js';
 import { s as script$2 } from './OrIcon-8f6c9c29.js';
 import { s as script$4 } from './OrMenuItem-c5d2a427.js';
-import { s as script$3 } from './OrMenu-72844eb1.js';
-import './OrPopover-3b07d49e.js';
+import { s as script$3 } from './OrMenu-33d89df4.js';
+import './OrPopover-062e78f6.js';
 import { resolveComponent, openBlock, createElementBlock, normalizeClass, createElementVNode, createVNode, withModifiers, withCtx, Fragment, renderList, createBlock, createTextVNode, toDisplayString, createCommentVNode } from 'vue';
 
 const PaginationRoot = [

package/dist/esm/v3/{OrPopover-3b07d49e.js → OrPopover-062e78f6.js}

@@ -6,75 +6,10 @@ import './dom-aecadd9a.js';
 import { u as usePopoverState } from './usePopoverState-b92c698b.js';
 import { u as useResponsive } from './useResponsive-5c8291da.js';
 import '@onereach/styles/tailwind.config.json';
-import { s as script$1 } from './OrBottomSheet-375aa75c.js';
-import { s as script$2 } from './OrTeleport.vue3-8099178c.js';
+import { s as script$1 } from './OrBottomSheet-e6c0b05f.js';
+import { s as script$2 } from './OrTeleport.vue3-bf77eed4.js';
 import { resolveComponent, openBlock, createBlock, withCtx, withDirectives, createElementVNode, createElementBlock, mergeProps, renderSlot, normalizeClass, createCommentVNode, vShow } from 'vue';
 
-var PopoverVariant;
-(function (PopoverVariant) {
-  PopoverVariant["Auto"] = "auto";
-  PopoverVariant["Popover"] = "popover";
-  PopoverVariant["BottomSheet"] = "bottom-sheet";
-})(PopoverVariant || (PopoverVariant = {}));
-var PopoverPlacement;
-(function (PopoverPlacement) {
-  PopoverPlacement["Top"] = "top";
-  PopoverPlacement["TopStart"] = "top-start";
-  PopoverPlacement["TopEnd"] = "top-end";
-  PopoverPlacement["Bottom"] = "bottom";
-  PopoverPlacement["BottomStart"] = "bottom-start";
-  PopoverPlacement["BottomEnd"] = "bottom-end";
-  PopoverPlacement["Left"] = "left";
-  PopoverPlacement["LeftStart"] = "left-start";
-  PopoverPlacement["LeftEnd"] = "left-end";
-  PopoverPlacement["Right"] = "right";
-  PopoverPlacement["RightStart"] = "right-start";
-  PopoverPlacement["RightEnd"] = "right-end";
-})(PopoverPlacement || (PopoverPlacement = {}));
-
-const Popover = [
-// Position
-'absolute'];
-const PopoverBody = [
-// Spacing
-'mx-sm', 'my-sm',
-// Shape
-'rounded-md',
-// Elevation
-'shadow-contextual', 'dark:shadow-contextual-dark',
-// Theme
-'theme-background-base', 'dark:theme-background-base-dark', 'theme-foreground-default', 'dark:theme-foreground-default-dark'];
-const PopoverBodyPlacements = {
-  [PopoverPlacement.Top]: [],
-  [PopoverPlacement.TopStart]: [
-  // Spacing
-  'ml-none'],
-  [PopoverPlacement.TopEnd]: [
-  // Spacing
-  'mr-none'],
-  [PopoverPlacement.Bottom]: [],
-  [PopoverPlacement.BottomStart]: [
-  // Spacing
-  'ml-none'],
-  [PopoverPlacement.BottomEnd]: [
-  // Spacing
-  'mr-none'],
-  [PopoverPlacement.Left]: [],
-  [PopoverPlacement.LeftStart]: [
-  // Spacing
-  'mt-none'],
-  [PopoverPlacement.LeftEnd]: [
-  // Spacing
-  'mb-none'],
-  [PopoverPlacement.Right]: [],
-  [PopoverPlacement.RightStart]: [
-  // Spacing
-  'mt-none'],
-  [PopoverPlacement.RightEnd]: [
-  // Spacing
-  'mb-none']
-};
-
 function roundByDPR(element, value) {
   const dpr = getDPR(element);
   return Math.round(value * dpr) / dpr;
@@ -208,6 +143,71 @@ function useFloating(reference, floating) {
   };
 }
 
+var PopoverVariant;
+(function (PopoverVariant) {
+  PopoverVariant["Auto"] = "auto";
+  PopoverVariant["Popover"] = "popover";
+  PopoverVariant["BottomSheet"] = "bottom-sheet";
+})(PopoverVariant || (PopoverVariant = {}));
+var PopoverPlacement;
+(function (PopoverPlacement) {
+  PopoverPlacement["Top"] = "top";
+  PopoverPlacement["TopStart"] = "top-start";
+  PopoverPlacement["TopEnd"] = "top-end";
+  PopoverPlacement["Bottom"] = "bottom";
+  PopoverPlacement["BottomStart"] = "bottom-start";
+  PopoverPlacement["BottomEnd"] = "bottom-end";
+  PopoverPlacement["Left"] = "left";
+  PopoverPlacement["LeftStart"] = "left-start";
+  PopoverPlacement["LeftEnd"] = "left-end";
+  PopoverPlacement["Right"] = "right";
+  PopoverPlacement["RightStart"] = "right-start";
+  PopoverPlacement["RightEnd"] = "right-end";
+})(PopoverPlacement || (PopoverPlacement = {}));
+
+const Popover = [
+// Position
+'absolute'];
+const PopoverBody = [
+// Spacing
+'mx-sm', 'my-sm',
+// Shape
+'rounded-md',
+// Elevation
+'shadow-contextual', 'dark:shadow-contextual-dark',
+// Theme
+'theme-background-base', 'dark:theme-background-base-dark', 'theme-foreground-default', 'dark:theme-foreground-default-dark'];
+const PopoverBodyPlacements = {
+  [PopoverPlacement.Top]: [],
+  [PopoverPlacement.TopStart]: [
+  // Spacing
+  'ml-none'],
+  [PopoverPlacement.TopEnd]: [
+  // Spacing
+  'mr-none'],
+  [PopoverPlacement.Bottom]: [],
+  [PopoverPlacement.BottomStart]: [
+  // Spacing
+  'ml-none'],
+  [PopoverPlacement.BottomEnd]: [
+  // Spacing
+  'mr-none'],
+  [PopoverPlacement.Left]: [],
+  [PopoverPlacement.LeftStart]: [
+  // Spacing
+  'mt-none'],
+  [PopoverPlacement.LeftEnd]: [
+  // Spacing
+  'mb-none'],
+  [PopoverPlacement.Right]: [],
+  [PopoverPlacement.RightStart]: [
+  // Spacing
+  'mt-none'],
+  [PopoverPlacement.RightEnd]: [
+  // Spacing
+  'mb-none']
+};
+
 var script = defineComponent({
   components: {
     OrBottomSheet: script$1,
@@ -215,6 +215,11 @@ var script = defineComponent({
   },
   inheritAttrs: false,
   props: {
+    // @workaround for Vue 2
+    customStyles: {
+      type: Array,
+      default: () => []
+    },
     isOpen: {
       type: Boolean,
       default: false
@@ -243,10 +248,6 @@ var script = defineComponent({
       type: Boolean,
       default: false
     },
-    customStyles: {
-      type: Array,
-      default: () => []
-    },
     disableDefaultStyles: {
       type: Boolean,
       default: false
@@ -270,7 +271,7 @@ var script = defineComponent({
       fullWidth
     } = toRefs(props);
     // Styles
-    const rootStyles = computed(() => ['or-popover-v3', ...Popover, ...props.customStyles]);
+    const rootStyles = computed(() => ['or-popover-v3', ...Popover, ...('class' in context.attrs ? [] : props.customStyles)]);
     const bodyStyles = computed(() => [...PopoverBody, ...PopoverBodyPlacements[placement.value]]);
     // State
     const {

package/dist/esm/v3/{OrResizeablePanel-1e865eb0.js → OrResizeablePanel-c1ae9811.js}

@@ -4,7 +4,7 @@ import './dom-aecadd9a.js';
 import { u as usePopoverState } from './usePopoverState-b92c698b.js';
 import '@onereach/styles/tailwind/plugins/core';
 import '@onereach/styles/tailwind.config.json';
-import { s as script$1 } from './OrIconButton-98a2ab6c.js';
+import { s as script$1 } from './OrIconButton-38032a99.js';
 import { resolveComponent, openBlock, createElementBlock, normalizeClass, normalizeStyle, renderSlot, createElementVNode, createVNode, createCommentVNode } from 'vue';
 
 var ResizeablePanelPadding;

package/dist/esm/v3/{OrRichTextEditor-35308c25.js → OrRichTextEditor-9e82e062.js}

@@ -16,13 +16,13 @@ import Blockquote from '@tiptap/extension-blockquote';
 import Link from '@tiptap/extension-link';
 import Highlight from '@tiptap/extension-highlight';
 import Underline from '@tiptap/extension-underline';
-import { s as script$1 } from './OrIconButton-98a2ab6c.js';
+import { s as script$1 } from './OrIconButton-38032a99.js';
 import { s as script$2 } from './OrLabel-b826da04.js';
-import { s as script$4 } from './OrMenu-72844eb1.js';
-import { s as script$8 } from './OrPopover-3b07d49e.js';
+import { s as script$4 } from './OrMenu-33d89df4.js';
+import { s as script$8 } from './OrPopover-062e78f6.js';
 import { s as script$3 } from './OrMenuItem-c5d2a427.js';
-import { s as script$5 } from './OrModal-5fd452ff.js';
-import { s as script$6 } from './OrInput-2d8e1231.js';
+import { s as script$5 } from './OrModal-f2db8685.js';
+import { s as script$6 } from './OrInput-16b5c1d9.js';
 import { s as script$7 } from './OrButton-2e3a73fb.js';
 import _ from 'lodash';
 import { Node, Editor, mergeAttributes } from '@tiptap/core';

package/dist/esm/v3/{OrSearch-434adc5e.js → OrSearch-9cb6cdf6.js}

@@ -1,6 +1,6 @@
 import { debouncedWatch } from '@vueuse/core';
 import { defineComponent, ref, computed, reactive, watch } from 'vue-demi';
-import { s as script$1 } from './OrInput-2d8e1231.js';
+import { s as script$1 } from './OrInput-16b5c1d9.js';
 import { I as InputBoxSize } from './OrInputBox-f0bac539.js';
 import { a as useIdAttribute, u as useControlAttributes } from './useIdAttribute-859439f0.js';
 import './dom-aecadd9a.js';

package/dist/esm/v3/{OrSelect-2666fd71.js → OrSelect-3c4e3036.js}

@@ -10,15 +10,15 @@ import { s as script$3 } from './OrCheckbox-4e9a3021.js';
 import { s as script$4 } from './OrError-69bd7f6a.js';
 import { s as script$5 } from './OrExpansionPanel-abe63bbb.js';
 import { s as script$6 } from './OrHint-55d3de35.js';
-import { s as script$8 } from './OrIconButton-98a2ab6c.js';
+import { s as script$8 } from './OrIconButton-38032a99.js';
 import { s as script$7 } from './OrIcon-8f6c9c29.js';
 import { s as script$a, I as InputBoxSize } from './OrInputBox-f0bac539.js';
-import { s as script$9 } from './OrInput-2d8e1231.js';
+import { s as script$9 } from './OrInput-16b5c1d9.js';
 import { s as script$b } from './OrLabel-b826da04.js';
 import { s as script$c } from './OrMenuItem-c5d2a427.js';
-import { s as script$d } from './OrPopover-3b07d49e.js';
-import { T as TagsOverflow } from './OrTags-58f503b5.js';
-import { s as script$1 } from './OrSelectMultipleControl-8f4d93b1.js';
+import { s as script$d } from './OrPopover-062e78f6.js';
+import { T as TagsOverflow } from './OrTags-8aa7c32e.js';
+import { s as script$1 } from './OrSelectMultipleControl-db000d2c.js';
 import { s as script$2 } from './OrSelectSingleControl-5e78d499.js';
 import './OrSelectPlaceholder-10e3bf5e.js';
 import { resolveComponent, resolveDirective, openBlock, createElementBlock, normalizeClass, createBlock, withCtx, renderSlot, createTextVNode, toDisplayString, createCommentVNode, withDirectives, createElementVNode, withModifiers, createVNode, Fragment, renderList, vShow } from 'vue';
@@ -219,7 +219,7 @@ var script = defineComponent({
     const searchControlStyles = computed(() => [...SelectSearchControl]);
     const dropdownStyles = computed(() => {
       var _a;
-      return [...SelectDropdown, ...(((_a = popover.value) === null || _a === void 0 ? void 0 : _a.isFlipped) ? SelectDropdownFlipped : SelectDropdownDefault)];
+      return ['or-select-popover-v3', ...SelectDropdown, ...(((_a = popover.value) === null || _a === void 0 ? void 0 : _a.isFlipped) ? SelectDropdownFlipped : SelectDropdownDefault)];
     });
     const dropdownItemStyles = computed(() => [...SelectDropdownItem]);
     const noSearchResultsStyles = computed(() => [...SelectNoSearchResults]);
@@ -472,11 +472,12 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
       variant: 'outlined'
     }, null, 8 /* PROPS */, ["icon", "class"])]), createVNode(_component_OrPopover, {
       ref: "popover",
+      class: normalizeClass(_ctx.dropdownStyles),
+      "custom-styles": _ctx.dropdownStyles,
       variant: 'auto',
       trigger: _ctx.inputBoxRoot,
       placement: 'bottom',
       "full-width": true,
-      "custom-styles": _ctx.dropdownStyles,
       "disable-default-styles": true
     }, {
       default: withCtx(() => [_ctx.popoverState === 'open' && _ctx.enableSearch && _ctx.isMobile ? (openBlock(), createBlock(_component_OrInput, {
@@ -587,7 +588,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
       }, () => [createTextVNode(" No results ")])], 2 /* CLASS */))]),
 
       _: 3 /* FORWARDED */
-    }, 8 /* PROPS */, ["trigger", "custom-styles"])]),
+    }, 8 /* PROPS */, ["class", "custom-styles", "trigger"])]),
     _: 3 /* FORWARDED */
   }, 8 /* PROPS */, ["class", "variant", "size", "invalid", "readonly", "disabled"])), [[_directive_dropdown_open, _ctx.toggle], [_directive_dropdown_close, _ctx.close]]), withDirectives(createElementVNode("div", _hoisted_4, [_ctx.hint ? (openBlock(), createBlock(_component_OrHint, {
     key: 0,

package/dist/esm/v3/{OrSelectMultipleControl-8f4d93b1.js → OrSelectMultipleControl-db000d2c.js}

@@ -5,7 +5,7 @@ import { i as isEqualValue } from './isEqualValue-f8bf73d9.js';
 import { u as useProxyModelValue } from './useProxyModelValue-940010d2.js';
 import '@onereach/styles/tailwind/plugins/core';
 import '@onereach/styles/tailwind.config.json';
-import { s as script$3, T as TagsOverflow } from './OrTags-58f503b5.js';
+import { s as script$3, T as TagsOverflow } from './OrTags-8aa7c32e.js';
 import { s as script$1 } from './OrSelectPlaceholder-10e3bf5e.js';
 import { i as isEmptyValue } from './isEmptyValue-fd56a6e4.js';
 import { s as script$2 } from './OrSelectControlInput-3297e30d.js';

package/dist/esm/v3/{OrSidebar-86b1f5a9.js → OrSidebar-9ad47cfd.js}

@@ -4,7 +4,7 @@ import './dom-aecadd9a.js';
 import { u as usePopoverState } from './usePopoverState-b92c698b.js';
 import '@onereach/styles/tailwind/plugins/core';
 import '@onereach/styles/tailwind.config.json';
-import { R as ResizeablePanelPadding, s as script$1 } from './OrResizeablePanel-1e865eb0.js';
+import { R as ResizeablePanelPadding, s as script$1 } from './OrResizeablePanel-c1ae9811.js';
 import { resolveComponent, openBlock, createBlock, createSlots, withCtx, createElementVNode, normalizeClass, createElementBlock, renderSlot, createCommentVNode } from 'vue';
 
 var SidebarPlacement;

package/dist/esm/v3/{OrSorting-82ebb6f5.js → OrSorting-b1916cdb.js}

@@ -1,6 +1,6 @@
 import { defineComponent, ref, toRef, computed } from 'vue-demi';
-import { s as script$1 } from './OrMenu-72844eb1.js';
-import './OrPopover-3b07d49e.js';
+import { s as script$1 } from './OrMenu-33d89df4.js';
+import './OrPopover-062e78f6.js';
 import { s as script$2 } from './OrMenuItem-c5d2a427.js';
 import { s as script$3 } from './OrButton-2e3a73fb.js';
 import { s as script$4 } from './OrIcon-8f6c9c29.js';

package/dist/esm/v3/{OrTabs-03b959f6.js → OrTabs-c68c8be3.js}

@@ -6,8 +6,8 @@ import '@onereach/styles/tailwind/plugins/core';
 import '@onereach/styles/tailwind.config.json';
 import { s as script$1 } from './OrIcon-8f6c9c29.js';
 import { s as script$3 } from './OrMenuItem-c5d2a427.js';
-import { s as script$2 } from './OrMenu-72844eb1.js';
-import './OrPopover-3b07d49e.js';
+import { s as script$2 } from './OrMenu-33d89df4.js';
+import './OrPopover-062e78f6.js';
 import { s as script$4 } from './OrTab-276ea81d.js';
 import { resolveComponent, openBlock, createElementBlock, normalizeClass, createElementVNode, mergeProps, Fragment, renderList, createBlock, withModifiers, withCtx, renderSlot, createTextVNode, toDisplayString, createVNode, createCommentVNode } from 'vue';
 

package/dist/esm/v3/{OrTag-beac1cd3.js → OrTag-e1b527ee.js}

@@ -1,5 +1,5 @@
 import { defineComponent, ref, computed, watchPostEffect, unref } from 'vue-demi';
-import { s as script$1 } from './OrIconButton-98a2ab6c.js';
+import { s as script$1 } from './OrIconButton-38032a99.js';
 import { resolveComponent, openBlock, createElementBlock, normalizeClass, createElementVNode, renderSlot, createVNode, withModifiers, createCommentVNode } from 'vue';
 
 var TagVariant;

package/dist/esm/v3/{OrTagInput-16575f45.js → OrTagInput-2b7974be.js}

@@ -8,10 +8,10 @@ import '@onereach/styles/tailwind.config.json';
 import { u as useValidationAttributes } from './useValidationAttributes-d1abbe34.js';
 import { s as script$1 } from './OrError-69bd7f6a.js';
 import { s as script$2 } from './OrHint-55d3de35.js';
-import { s as script$3 } from './OrIconButton-98a2ab6c.js';
+import { s as script$3 } from './OrIconButton-38032a99.js';
 import { s as script$4 } from './OrInputBox-f0bac539.js';
 import { s as script$5 } from './OrLabel-b826da04.js';
-import { s as script$6, T as TagsOverflow } from './OrTags-58f503b5.js';
+import { s as script$6, T as TagsOverflow } from './OrTags-8aa7c32e.js';
 import { resolveComponent, openBlock, createElementBlock, normalizeClass, createBlock, withCtx, renderSlot, createTextVNode, toDisplayString, createCommentVNode, createVNode, createSlots, createElementVNode, withDirectives, mergeProps, withKeys, vModelDynamic, vShow } from 'vue';
 import { s as styleInject } from './style-inject.es-4c6f2515.js';
 

package/dist/esm/v3/{OrTags-58f503b5.js → OrTags-8aa7c32e.js}

@@ -4,8 +4,8 @@ import '@vueuse/core';
 import '@onereach/styles/tailwind/plugins/core';
 import '@onereach/styles/tailwind.config.json';
 import { s as script$1 } from './OrButton-2e3a73fb.js';
-import { s as script$2 } from './OrPopover-3b07d49e.js';
-import { s as script$3 } from './OrTag-beac1cd3.js';
+import { s as script$2 } from './OrPopover-062e78f6.js';
+import { s as script$3 } from './OrTag-e1b527ee.js';
 import { resolveComponent, openBlock, createElementBlock, normalizeClass, Fragment, renderList, createBlock, mergeProps, withCtx, createTextVNode, toDisplayString, renderSlot, createCommentVNode, createVNode, withModifiers, createElementVNode } from 'vue';
 
 var TagsOverflow;
@@ -123,6 +123,7 @@ var script = defineComponent({
     });
     // Styles
     const rootStyles = computed(() => ['or-tags-v3', ...Tags]);
+    const popoverStyles = computed(() => ['or-tags-popover-v3']);
     const containerStyles = computed(() => [...TagsContainer, ...TagsContainerOverflows[localOverflow.value]]);
     const overflowButtonStyles = computed(() => [...TagsOverflowButton]);
     const overflowPopoverStyles = computed(() => [...TagsOverflowPopover]);
@@ -162,6 +163,7 @@ var script = defineComponent({
       overflowPopover,
       overflowPopoverRoot,
       rootStyles,
+      popoverStyles,
       containerStyles,
       overflowButtonStyles,
       overflowPopoverStyles,
@@ -211,6 +213,8 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
     _: 1 /* STABLE */
   }, 8 /* PROPS */, ["class", "disabled", "onClick"]), createVNode(_component_OrPopover, {
     ref: "overflowPopover",
+    class: normalizeClass(_ctx.popoverStyles),
+    "custom-styles": _ctx.popoverStyles,
     trigger: _ctx.overflowButtonRoot
   }, {
     default: withCtx(() => [createElementVNode("div", {
@@ -227,7 +231,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
     }), 128 /* KEYED_FRAGMENT */))], 2 /* CLASS */)]),
 
     _: 1 /* STABLE */
-  }, 8 /* PROPS */, ["trigger"])], 64 /* STABLE_FRAGMENT */)) : createCommentVNode("v-if", true), _ctx.localOverflow != 'wrap' || _ctx.items.length === 0 ? renderSlot(_ctx.$slots, "tail", {
+  }, 8 /* PROPS */, ["class", "custom-styles", "trigger"])], 64 /* STABLE_FRAGMENT */)) : createCommentVNode("v-if", true), _ctx.localOverflow != 'wrap' || _ctx.items.length === 0 ? renderSlot(_ctx.$slots, "tail", {
     key: 2
   }) : createCommentVNode("v-if", true)], 2 /* CLASS */);
 }

package/dist/esm/v3/{OrTeleport.vue3-8099178c.js → OrTeleport.vue3-bf77eed4.js}

@@ -2,7 +2,6 @@ import { defineComponent } from 'vue-demi';
 import { openBlock, createBlock, Teleport, renderSlot } from 'vue';
 
 var script = defineComponent({
-  name: 'OrTeleport',
   props: {
     to: {
       type: String,

package/dist/esm/v3/{OrTimeFormat-42df610f.js → OrTimeFormat-948f49a5.js}

@@ -1,6 +1,6 @@
 import { defineComponent, ref, computed } from 'vue-demi';
-import './OrDateTimePicker-e050b5fc.js';
-import './OrDateTimePickerTimeSelect-ed31f8b3.js';
+import './OrDateTimePicker-9d1275f9.js';
+import './OrDateTimePickerTimeSelect-16af1cc9.js';
 import { D as DateTimePickerTimeFormat, a as formatTime } from './getTimePlaceholder-13d5f743.js';
 import { openBlock, createElementBlock, normalizeClass, toDisplayString } from 'vue';