@onereach/ui-components 3.0.4-beta.2486.0 → 3.0.4-beta.2487.0

package/dist/esm/v3/{OrMenu-053a9ab7.js → OrMenu-70cee836.js}

@@ -25,7 +25,7 @@ var script = defineComponent({
     }
   },
   emits: ['update:state'],
-  expose: ['root', 'isOpen', 'open', 'close', 'toggle'],
+  expose: ['root', 'state', 'isOpen', 'open', 'close', 'toggle'],
   setup() {
     // Refs
     const root = ref();
@@ -34,6 +34,10 @@ var script = defineComponent({
       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
@@ -73,6 +77,7 @@ var script = defineComponent({
       root,
       popover,
       popoverRoot,
+      state: popoverState,
       rootStyles,
       isOpen,
       open,

package/dist/esm/v3/{OrPagination-f2d104d9.js → OrPagination-7f4ed166.js}

@@ -4,7 +4,7 @@ import { u as useResponsive } from './useResponsive-a02e95b7.js';
 import { s as script$1 } from './OrButton-5a850657.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-053a9ab7.js';
+import { s as script$3 } from './OrMenu-70cee836.js';
 import './OrPopover-3ac8f589.js';
 import { resolveComponent, openBlock, createElementBlock, normalizeClass, createElementVNode, createVNode, withModifiers, withCtx, Fragment, renderList, createBlock, createTextVNode, toDisplayString, createCommentVNode } from 'vue';
 

package/dist/esm/v3/{OrTabs-d9e2a07e.js → OrTabs-0a5c80be.js}

@@ -2,7 +2,7 @@ import { useResizeObserver } from '@vueuse/core';
 import { defineComponent, ref, computed, reactive, watch, nextTick, onMounted } from 'vue-demi';
 import { s as script$1 } from './OrIcon-62793572.js';
 import { s as script$3 } from './OrMenuItem-dbee450f.js';
-import { s as script$2 } from './OrMenu-053a9ab7.js';
+import { s as script$2 } from './OrMenu-70cee836.js';
 import './OrPopover-3ac8f589.js';
 import { s as script$4 } from './OrTab-c11d94f6.js';
 import { resolveComponent, openBlock, createElementBlock, createElementVNode, mergeProps, Fragment, renderList, createBlock, withModifiers, withCtx, createTextVNode, toDisplayString, createVNode, createCommentVNode, renderSlot } from 'vue';

package/dist/esm/v3/components/index.js

@@ -6,7 +6,7 @@ export { b as BUTTON_COLOR, d as BUTTON_LOADER_TYPE, c as BUTTON_SIZE, B as BUTT
 export { a as ButtonColor, b as ButtonType, B as ButtonVariant, s as OrButtonV3 } from '../OrButton-5a850657.js';
 export { s as OrCard } from '../OrCard-e3a5aea4.js';
 export { C as CARD_COLLECTION_LAYOUT, s as OrCardCollection } from '../OrCardCollection-70131a12.js';
-export { D as DefaultCardCollectionViews, s as OrCardCollectionV3, d as defaultViewModes, g as gridView, l as listView } from '../OrCardCollection-aa7f0c81.js';
+export { D as DefaultCardCollectionViews, s as OrCardCollectionV3, d as defaultViewModes, g as gridView, l as listView } from '../OrCardCollection-b937aa7a.js';
 export { s as OrCardV3 } from '../OrCard-cc82902c.js';
 export { a as OrCarousel, s as OrCarouselItem } from '../OrCarouselItem-a3a855e8.js';
 export { s as OrCheckbox } from '../OrCheckbox-8d8887ea.js';
@@ -18,7 +18,7 @@ export { s as OrColorPicker, h as amber, n as black, b as blue, m as blueGrey, k
 export { s as OrConfirm } from '../OrConfirm-f408faf5.js';
 export { C as ConfirmType, s as OrConfirmV3 } from '../OrConfirm-ecb8c576.js';
 export { D as DEFAULT_TEXT, s as OrDateTimePicker, a as OrDateTimePickerItemTypes, O as OrDateTimePickerTypes } from '../OrDateTimePicker-30749526.js';
-export { s as OrDateTimePickerV3 } from '../OrDateTimePicker-3e2dc067.js';
+export { s as OrDateTimePickerV3 } from '../OrDateTimePicker-966d5b1d.js';
 export { I as DateTimePickerSize, I as InputBoxSize, a as InputBoxVariant, I as InputSize, s as OrInputBoxV3, I as SearchSize, I as SelectSize, I as TextareaSize } from '../OrInputBox-901887a1.js';
 export { E as EmptyStateSize, s as OrEmptyStateV3 } from '../OrEmptyState-5349a1f9.js';
 export { s as OrError } from '../OrError-f90296db.js';
@@ -46,7 +46,7 @@ export { s as OrListOfInputs } from '../OrListOfInputs-5a834c95.js';
 export { L as LoaderViews, s as OrLoader } from '../OrLoader-15174477.js';
 export { a as LoaderColor, b as LoaderSize, L as LoaderVariant, s as OrLoaderV3 } from '../OrLoader-b79022da.js';
 export { s as OrMenuItemV3 } from '../OrMenuItem-dbee450f.js';
-export { s as OrMenuV3 } from '../OrMenu-053a9ab7.js';
+export { s as OrMenuV3 } from '../OrMenu-70cee836.js';
 export { P as MenuPlacement, s as OrPopoverV3, P as PopoverPlacement, a as PopoverVariant, P as TooltipPlacement } from '../OrPopover-3ac8f589.js';
 export { s as OrModal, O as OrModalSizes } from '../OrModal-f3b2e0f4.js';
 export { M as ModalSize, s as OrModalV3 } from '../OrModal-7d4158d1.js';
@@ -56,7 +56,7 @@ export { s as OrNumberInput } from '../OrNumberInput-dca5e850.js';
 export { s as OrOverflowMenu } from '../OrOverflowMenu-08626d66.js';
 export { s as OrOverlay } from '../OrOverlay-451dce49.js';
 export { s as OrOverlayV3 } from '../OrOverlay-7cf03aea.js';
-export { s as OrPaginationV3 } from '../OrPagination-f2d104d9.js';
+export { s as OrPaginationV3 } from '../OrPagination-7f4ed166.js';
 export { s as OrPassword } from '../OrPassword-4a37f3ac.js';
 export { s as OrProgress, O as OrProgressColors, a as OrProgressTypes } from '../OrProgress-d0d52c86.js';
 export { s as OrProgressV3, P as ProgressColor, a as ProgressType } from '../OrProgress-33cf7445.js';
@@ -82,7 +82,7 @@ export { s as OrTab } from '../OrTab-bc98be02.js';
 export { s as OrTabHeaderItem } from '../OrTabHeaderItem-d668cc59.js';
 export { s as OrTabV3 } from '../OrTab-c11d94f6.js';
 export { s as OrTabs } from '../OrTabs-d3812c11.js';
-export { s as OrTabsV3, T as TabsVariant } from '../OrTabs-d9e2a07e.js';
+export { s as OrTabsV3, T as TabsVariant } from '../OrTabs-0a5c80be.js';
 export { s as OrTag } from '../OrTag-2192a3cf.js';
 export { s as OrTagV3, a as TagColor, T as TagVariant } from '../OrTag-1b49531d.js';
 export { s as OrTeleport } from '../OrTeleport.vue3-9bce0c02.js';

package/dist/esm/v3/components/or-card-collection-v3/index.js

@@ -1,4 +1,4 @@
-export { D as DefaultCardCollectionViews, s as OrCardCollectionV3, d as defaultViewModes, g as gridView, l as listView } from '../../OrCardCollection-aa7f0c81.js';
+export { D as DefaultCardCollectionViews, s as OrCardCollectionV3, d as defaultViewModes, g as gridView, l as listView } from '../../OrCardCollection-b937aa7a.js';
 import 'vue-demi';
 import '../../OrButton-5a850657.js';
 import '../../OrLoader-b79022da.js';
@@ -15,7 +15,7 @@ import '../../OrBottomSheet-0f24ecae.js';
 import '../../OrOverlay-7cf03aea.js';
 import '../../OrTeleport.vue3-8099178c.js';
 import '../../OrMenuItem-dbee450f.js';
-import '../../OrMenu-053a9ab7.js';
+import '../../OrMenu-70cee836.js';
 import '../../OrSearch-9989bb31.js';
 import '../../OrInput-dae6e478.js';
 import '../../useIdAttribute-859439f0.js';

package/dist/esm/v3/components/or-date-time-picker-v3/OrDateTimePicker.vue.d.ts

@@ -32,6 +32,7 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
         id: string | undefined;
     };
     proxyModelValue: import("@vue/composition-api").WritableComputedRef<Date>;
+    draftModelValue: import("@vue/composition-api").Ref<Date | undefined>;
     toggleDatePopover: () => void;
     toggleTimePopover: () => void;
     closeDatePopover: () => void;
@@ -154,6 +155,7 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
         id: string | undefined;
     };
     proxyModelValue: import("@vue/composition-api").WritableComputedRef<Date>;
+    draftModelValue: import("@vue/composition-api").Ref<Date | undefined>;
     toggleDatePopover: () => void;
     toggleTimePopover: () => void;
     closeDatePopover: () => void;

package/dist/esm/v3/components/or-date-time-picker-v3/hooks/useDefaultDate.d.ts

@@ -0,0 +1 @@
+export declare function useDefaultDate(): number;

package/dist/esm/v3/components/or-date-time-picker-v3/hooks/useDefaultHours.d.ts

@@ -0,0 +1 @@
+export declare function useDefaultHours(): number;

package/dist/esm/v3/components/or-date-time-picker-v3/hooks/useDefaultMinutes.d.ts

@@ -0,0 +1 @@
+export declare function useDefaultMinutes(): number;

package/dist/esm/v3/components/or-date-time-picker-v3/hooks/useDefaultMonth.d.ts

@@ -0,0 +1 @@
+export declare function useDefaultMonth(): number;

package/dist/esm/v3/components/or-date-time-picker-v3/hooks/useDefaultYear.d.ts

@@ -0,0 +1 @@
+export declare function useDefaultYear(): number;

package/dist/esm/v3/components/or-date-time-picker-v3/index.js

@@ -1,4 +1,4 @@
-export { s as OrDateTimePickerV3 } from '../../OrDateTimePicker-3e2dc067.js';
+export { s as OrDateTimePickerV3 } from '../../OrDateTimePicker-966d5b1d.js';
 export { I as DateTimePickerSize } from '../../OrInputBox-901887a1.js';
 import 'vue-demi';
 import 'vue';
@@ -23,4 +23,4 @@ import '../../OrLabel-4da56db0.js';
 import '../../OrButton-5a850657.js';
 import '../../OrLoader-b79022da.js';
 import '../../OrMenuItem-dbee450f.js';
-import '../../OrMenu-053a9ab7.js';
+import '../../OrMenu-70cee836.js';

package/dist/{bundled/v3/components/or-date-time-picker-v3/partials/or-date-time-picker-date-select/OrDateTimePickerDateSelect.vue.d.ts → esm/v3/components/or-date-time-picker-v3/partials/or-date-time-picker-day-select/OrDateTimePickerDaySelect.vue.d.ts}

@@ -1,7 +1,11 @@
 declare const _default: import("vue").ComponentOptions<import("vue").default, import("@vue/composition-api").ShallowUnwrapRef<{
     root: import("@vue/composition-api").Ref<HTMLElement | undefined>;
     rootStyles: import("@vue/composition-api").ComputedRef<string[]>;
+    buttonGroupStyles: import("@vue/composition-api").ComputedRef<string[]>;
+    buttonGroupItemStyles: import("@vue/composition-api").ComputedRef<string[]>;
     proxyModelValue: import("@vue/composition-api").WritableComputedRef<Date>;
+    dayOptions: import("@vue/composition-api").ComputedRef<Date[]>;
+    formatDay: (value: Date) => string;
 }> & import("@vue/composition-api").Data, {}, {}, {
     modelValue: {
         type: DateConstructor;
@@ -19,7 +23,11 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
 }, import("@vue/composition-api").ShallowUnwrapRef<{
     root: import("@vue/composition-api").Ref<HTMLElement | undefined>;
     rootStyles: import("@vue/composition-api").ComputedRef<string[]>;
+    buttonGroupStyles: import("@vue/composition-api").ComputedRef<string[]>;
+    buttonGroupItemStyles: import("@vue/composition-api").ComputedRef<string[]>;
     proxyModelValue: import("@vue/composition-api").WritableComputedRef<Date>;
+    dayOptions: import("@vue/composition-api").ComputedRef<Date[]>;
+    formatDay: (value: Date) => string;
 }>, import("@vue/composition-api").Data, {}, {}, {}, {}, string[], {
     modelValue: Date;
 } & {} & {

package/dist/esm/v3/components/or-date-time-picker-v3/partials/or-date-time-picker-day-select/styles.d.ts

@@ -0,0 +1,3 @@
+export declare const DateTimePickerDaySelect: string[];
+export declare const DateTimePickerDaySelectButtonGroup: string[];
+export declare const DateTimePickerDaySelectButtonGroupItem: string[];

package/dist/esm/v3/components/or-date-time-picker-v3/partials/or-date-time-picker-month-select/OrDateTimePickerMonthSelect.vue.d.ts

@@ -1,41 +1,37 @@
 declare const _default: import("vue").ComponentOptions<import("vue").default, import("@vue/composition-api").ShallowUnwrapRef<{
     root: import("@vue/composition-api").Ref<HTMLElement | undefined>;
-    monthButton: import("@vue/composition-api").Ref<import("@vue/composition-api").ComponentRenderProxy<{} & {}, import("@vue/composition-api").ShallowUnwrapRef<unknown>, unknown, import("@vue/composition-api").ComputedOptions, import("@vue/composition-api").MethodOptions, unknown, unknown, {
+    yearButton: import("@vue/composition-api").Ref<import("@vue/composition-api").ComponentRenderProxy<{} & {}, import("@vue/composition-api").ShallowUnwrapRef<unknown>, unknown, import("@vue/composition-api").ComputedOptions, import("@vue/composition-api").MethodOptions, unknown, unknown, {
         [x: string]: ((...args: any[]) => any) | null;
     } | string[], {} & {}, {
         [x: number]: string;
     } | {}, true> | undefined>;
-    yearButton: import("@vue/composition-api").Ref<import("@vue/composition-api").ComponentRenderProxy<{} & {}, import("@vue/composition-api").ShallowUnwrapRef<unknown>, unknown, import("@vue/composition-api").ComputedOptions, import("@vue/composition-api").MethodOptions, unknown, unknown, {
+    monthButton: import("@vue/composition-api").Ref<import("@vue/composition-api").ComponentRenderProxy<{} & {}, import("@vue/composition-api").ShallowUnwrapRef<unknown>, unknown, import("@vue/composition-api").ComputedOptions, import("@vue/composition-api").MethodOptions, unknown, unknown, {
         [x: string]: ((...args: any[]) => any) | null;
     } | string[], {} & {}, {
         [x: number]: string;
     } | {}, true> | undefined>;
-    monthButtonRoot: import("@vue/composition-api").ComputedRef<undefined>;
     yearButtonRoot: import("@vue/composition-api").ComputedRef<undefined>;
-    monthMenu: import("@vue/composition-api").Ref<import("@vue/composition-api").ComponentRenderProxy<{} & {}, import("@vue/composition-api").ShallowUnwrapRef<unknown>, unknown, import("@vue/composition-api").ComputedOptions, import("@vue/composition-api").MethodOptions, unknown, unknown, {
+    monthButtonRoot: import("@vue/composition-api").ComputedRef<undefined>;
+    yearMenu: import("@vue/composition-api").Ref<import("@vue/composition-api").ComponentRenderProxy<{} & {}, import("@vue/composition-api").ShallowUnwrapRef<unknown>, unknown, import("@vue/composition-api").ComputedOptions, import("@vue/composition-api").MethodOptions, unknown, unknown, {
         [x: string]: ((...args: any[]) => any) | null;
     } | string[], {} & {}, {
         [x: number]: string;
     } | {}, true> | undefined>;
-    yearMenu: import("@vue/composition-api").Ref<import("@vue/composition-api").ComponentRenderProxy<{} & {}, import("@vue/composition-api").ShallowUnwrapRef<unknown>, unknown, import("@vue/composition-api").ComputedOptions, import("@vue/composition-api").MethodOptions, unknown, unknown, {
+    monthMenu: import("@vue/composition-api").Ref<import("@vue/composition-api").ComponentRenderProxy<{} & {}, import("@vue/composition-api").ShallowUnwrapRef<unknown>, unknown, import("@vue/composition-api").ComputedOptions, import("@vue/composition-api").MethodOptions, unknown, unknown, {
         [x: string]: ((...args: any[]) => any) | null;
     } | string[], {} & {}, {
         [x: number]: string;
     } | {}, true> | undefined>;
+    yearMenuState: import("@vue/composition-api").ComputedRef<undefined>;
+    monthMenuState: import("@vue/composition-api").ComputedRef<undefined>;
     rootStyles: import("@vue/composition-api").ComputedRef<string[]>;
     proxyModelValue: import("@vue/composition-api").WritableComputedRef<Date>;
-    yearValue: import("@vue/composition-api").WritableComputedRef<number>;
-    monthValue: import("@vue/composition-api").WritableComputedRef<number>;
-    yearLabel: import("@vue/composition-api").ComputedRef<string | undefined>;
-    monthLabel: import("@vue/composition-api").ComputedRef<string | undefined>;
-    yearOptions: {
-        value: number;
-        label: string;
-    }[];
-    monthOptions: {
-        value: number;
-        label: string;
-    }[];
+    yearOptions: import("@vue/composition-api").ComputedRef<Date[]>;
+    monthOptions: import("@vue/composition-api").ComputedRef<Date[]>;
+    goToNextMonth: () => void;
+    goToPreviousMonth: () => void;
+    formatYear: (value: Date) => string;
+    formatMonth: (value: Date) => string;
 }> & import("@vue/composition-api").Data, {}, {}, {
     modelValue: {
         type: DateConstructor;
@@ -52,42 +48,38 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
     [x: `on${Capitalize<string>}`]: ((...args: any[]) => any) | undefined;
 }, import("@vue/composition-api").ShallowUnwrapRef<{
     root: import("@vue/composition-api").Ref<HTMLElement | undefined>;
-    monthButton: import("@vue/composition-api").Ref<import("@vue/composition-api").ComponentRenderProxy<{} & {}, import("@vue/composition-api").ShallowUnwrapRef<unknown>, unknown, import("@vue/composition-api").ComputedOptions, import("@vue/composition-api").MethodOptions, unknown, unknown, {
+    yearButton: import("@vue/composition-api").Ref<import("@vue/composition-api").ComponentRenderProxy<{} & {}, import("@vue/composition-api").ShallowUnwrapRef<unknown>, unknown, import("@vue/composition-api").ComputedOptions, import("@vue/composition-api").MethodOptions, unknown, unknown, {
         [x: string]: ((...args: any[]) => any) | null;
     } | string[], {} & {}, {
         [x: number]: string;
     } | {}, true> | undefined>;
-    yearButton: import("@vue/composition-api").Ref<import("@vue/composition-api").ComponentRenderProxy<{} & {}, import("@vue/composition-api").ShallowUnwrapRef<unknown>, unknown, import("@vue/composition-api").ComputedOptions, import("@vue/composition-api").MethodOptions, unknown, unknown, {
+    monthButton: import("@vue/composition-api").Ref<import("@vue/composition-api").ComponentRenderProxy<{} & {}, import("@vue/composition-api").ShallowUnwrapRef<unknown>, unknown, import("@vue/composition-api").ComputedOptions, import("@vue/composition-api").MethodOptions, unknown, unknown, {
         [x: string]: ((...args: any[]) => any) | null;
     } | string[], {} & {}, {
         [x: number]: string;
     } | {}, true> | undefined>;
-    monthButtonRoot: import("@vue/composition-api").ComputedRef<undefined>;
     yearButtonRoot: import("@vue/composition-api").ComputedRef<undefined>;
-    monthMenu: import("@vue/composition-api").Ref<import("@vue/composition-api").ComponentRenderProxy<{} & {}, import("@vue/composition-api").ShallowUnwrapRef<unknown>, unknown, import("@vue/composition-api").ComputedOptions, import("@vue/composition-api").MethodOptions, unknown, unknown, {
+    monthButtonRoot: import("@vue/composition-api").ComputedRef<undefined>;
+    yearMenu: import("@vue/composition-api").Ref<import("@vue/composition-api").ComponentRenderProxy<{} & {}, import("@vue/composition-api").ShallowUnwrapRef<unknown>, unknown, import("@vue/composition-api").ComputedOptions, import("@vue/composition-api").MethodOptions, unknown, unknown, {
         [x: string]: ((...args: any[]) => any) | null;
     } | string[], {} & {}, {
         [x: number]: string;
     } | {}, true> | undefined>;
-    yearMenu: import("@vue/composition-api").Ref<import("@vue/composition-api").ComponentRenderProxy<{} & {}, import("@vue/composition-api").ShallowUnwrapRef<unknown>, unknown, import("@vue/composition-api").ComputedOptions, import("@vue/composition-api").MethodOptions, unknown, unknown, {
+    monthMenu: import("@vue/composition-api").Ref<import("@vue/composition-api").ComponentRenderProxy<{} & {}, import("@vue/composition-api").ShallowUnwrapRef<unknown>, unknown, import("@vue/composition-api").ComputedOptions, import("@vue/composition-api").MethodOptions, unknown, unknown, {
         [x: string]: ((...args: any[]) => any) | null;
     } | string[], {} & {}, {
         [x: number]: string;
     } | {}, true> | undefined>;
+    yearMenuState: import("@vue/composition-api").ComputedRef<undefined>;
+    monthMenuState: import("@vue/composition-api").ComputedRef<undefined>;
     rootStyles: import("@vue/composition-api").ComputedRef<string[]>;
     proxyModelValue: import("@vue/composition-api").WritableComputedRef<Date>;
-    yearValue: import("@vue/composition-api").WritableComputedRef<number>;
-    monthValue: import("@vue/composition-api").WritableComputedRef<number>;
-    yearLabel: import("@vue/composition-api").ComputedRef<string | undefined>;
-    monthLabel: import("@vue/composition-api").ComputedRef<string | undefined>;
-    yearOptions: {
-        value: number;
-        label: string;
-    }[];
-    monthOptions: {
-        value: number;
-        label: string;
-    }[];
+    yearOptions: import("@vue/composition-api").ComputedRef<Date[]>;
+    monthOptions: import("@vue/composition-api").ComputedRef<Date[]>;
+    goToNextMonth: () => void;
+    goToPreviousMonth: () => void;
+    formatYear: (value: Date) => string;
+    formatMonth: (value: Date) => string;
 }>, import("@vue/composition-api").Data, {}, {}, {}, {}, string[], {
     modelValue: Date;
 } & {} & {

package/dist/esm/v3/components/or-date-time-picker-v3/partials/or-date-time-picker-time-select/OrDateTimePickerTimeSelect.vue.d.ts

@@ -4,16 +4,10 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
     buttonGroupStyles: import("@vue/composition-api").ComputedRef<string[]>;
     buttonGroupItemStyles: import("@vue/composition-api").ComputedRef<string[]>;
     proxyModelValue: import("@vue/composition-api").WritableComputedRef<Date>;
-    hoursValue: import("@vue/composition-api").WritableComputedRef<number>;
-    minutesValue: import("@vue/composition-api").WritableComputedRef<number>;
-    hoursOptions: {
-        value: number;
-        label: string;
-    }[];
-    minutesOptions: {
-        value: number;
-        label: string;
-    }[];
+    hoursOptions: import("@vue/composition-api").ComputedRef<Date[]>;
+    minutesOptions: import("@vue/composition-api").ComputedRef<Date[]>;
+    formatHours: (value: Date) => string;
+    formatMinutes: (value: Date) => string;
 }> & import("@vue/composition-api").Data, {}, {}, {
     modelValue: {
         type: DateConstructor;
@@ -34,16 +28,10 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
     buttonGroupStyles: import("@vue/composition-api").ComputedRef<string[]>;
     buttonGroupItemStyles: import("@vue/composition-api").ComputedRef<string[]>;
     proxyModelValue: import("@vue/composition-api").WritableComputedRef<Date>;
-    hoursValue: import("@vue/composition-api").WritableComputedRef<number>;
-    minutesValue: import("@vue/composition-api").WritableComputedRef<number>;
-    hoursOptions: {
-        value: number;
-        label: string;
-    }[];
-    minutesOptions: {
-        value: number;
-        label: string;
-    }[];
+    hoursOptions: import("@vue/composition-api").ComputedRef<Date[]>;
+    minutesOptions: import("@vue/composition-api").ComputedRef<Date[]>;
+    formatHours: (value: Date) => string;
+    formatMinutes: (value: Date) => string;
 }>, import("@vue/composition-api").Data, {}, {}, {}, {}, string[], {
     modelValue: Date;
 } & {} & {

package/dist/esm/v3/components/or-menu-v3/OrMenu.vue.d.ts

@@ -8,6 +8,7 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
         [x: number]: string;
     } | {}, true> | undefined>;
     popoverRoot: import("@vue/composition-api").ComputedRef<undefined>;
+    state: import("@vue/composition-api").ComputedRef<undefined>;
     rootStyles: import("@vue/composition-api").ComputedRef<string[]>;
     isOpen: import("@vue/composition-api").ComputedRef<undefined>;
     open: () => void;
@@ -51,6 +52,7 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
         [x: number]: string;
     } | {}, true> | undefined>;
     popoverRoot: import("@vue/composition-api").ComputedRef<undefined>;
+    state: import("@vue/composition-api").ComputedRef<undefined>;
     rootStyles: import("@vue/composition-api").ComputedRef<string[]>;
     isOpen: import("@vue/composition-api").ComputedRef<undefined>;
     open: () => void;

package/dist/esm/v3/components/or-menu-v3/index.js

@@ -1,4 +1,4 @@
-export { s as OrMenuV3 } from '../../OrMenu-053a9ab7.js';
+export { s as OrMenuV3 } from '../../OrMenu-70cee836.js';
 export { P as MenuPlacement } from '../../OrPopover-3ac8f589.js';
 import 'vue-demi';
 import 'vue';

package/dist/esm/v3/components/or-pagination-v3/index.js

@@ -1,4 +1,4 @@
-export { s as OrPaginationV3 } from '../../OrPagination-f2d104d9.js';
+export { s as OrPaginationV3 } from '../../OrPagination-7f4ed166.js';
 import 'vue-demi';
 import '@vueuse/core';
 import '../../useResponsive-a02e95b7.js';
@@ -7,7 +7,7 @@ import '../../OrLoader-b79022da.js';
 import 'vue';
 import '../../OrIcon-62793572.js';
 import '../../OrMenuItem-dbee450f.js';
-import '../../OrMenu-053a9ab7.js';
+import '../../OrMenu-70cee836.js';
 import '../../OrPopover-3ac8f589.js';
 import '@floating-ui/dom';
 import '../../useElevation-92fce12c.js';

package/dist/esm/v3/components/or-tabs-v3/index.js

@@ -1,10 +1,10 @@
-export { s as OrTabsV3, T as TabsVariant } from '../../OrTabs-d9e2a07e.js';
+export { s as OrTabsV3, T as TabsVariant } from '../../OrTabs-0a5c80be.js';
 import '@vueuse/core';
 import 'vue-demi';
 import '../../OrIcon-62793572.js';
 import 'vue';
 import '../../OrMenuItem-dbee450f.js';
-import '../../OrMenu-053a9ab7.js';
+import '../../OrMenu-70cee836.js';
 import '../../OrPopover-3ac8f589.js';
 import '@floating-ui/dom';
 import '../../useElevation-92fce12c.js';

package/dist/esm/v3/index.js

@@ -6,7 +6,7 @@ export { b as BUTTON_COLOR, d as BUTTON_LOADER_TYPE, c as BUTTON_SIZE, B as BUTT
 export { a as ButtonColor, b as ButtonType, B as ButtonVariant, s as OrButtonV3 } from './OrButton-5a850657.js';
 export { s as OrCard } from './OrCard-e3a5aea4.js';
 export { C as CARD_COLLECTION_LAYOUT, s as OrCardCollection } from './OrCardCollection-70131a12.js';
-export { D as DefaultCardCollectionViews, s as OrCardCollectionV3, d as defaultViewModes, g as gridView, l as listView } from './OrCardCollection-aa7f0c81.js';
+export { D as DefaultCardCollectionViews, s as OrCardCollectionV3, d as defaultViewModes, g as gridView, l as listView } from './OrCardCollection-b937aa7a.js';
 export { s as OrCardV3 } from './OrCard-cc82902c.js';
 export { a as OrCarousel, s as OrCarouselItem } from './OrCarouselItem-a3a855e8.js';
 export { s as OrCheckbox } from './OrCheckbox-8d8887ea.js';
@@ -18,7 +18,7 @@ export { s as OrColorPicker, h as amber, n as black, b as blue, m as blueGrey, k
 export { s as OrConfirm } from './OrConfirm-f408faf5.js';
 export { C as ConfirmType, s as OrConfirmV3 } from './OrConfirm-ecb8c576.js';
 export { D as DEFAULT_TEXT, s as OrDateTimePicker, a as OrDateTimePickerItemTypes, O as OrDateTimePickerTypes } from './OrDateTimePicker-30749526.js';
-export { s as OrDateTimePickerV3 } from './OrDateTimePicker-3e2dc067.js';
+export { s as OrDateTimePickerV3 } from './OrDateTimePicker-966d5b1d.js';
 export { I as DateTimePickerSize, I as InputBoxSize, a as InputBoxVariant, I as InputSize, s as OrInputBoxV3, I as SearchSize, I as SelectSize, I as TextareaSize } from './OrInputBox-901887a1.js';
 export { E as EmptyStateSize, s as OrEmptyStateV3 } from './OrEmptyState-5349a1f9.js';
 export { s as OrError } from './OrError-f90296db.js';
@@ -46,7 +46,7 @@ export { s as OrListOfInputs } from './OrListOfInputs-5a834c95.js';
 export { L as LoaderViews, s as OrLoader } from './OrLoader-15174477.js';
 export { a as LoaderColor, b as LoaderSize, L as LoaderVariant, s as OrLoaderV3 } from './OrLoader-b79022da.js';
 export { s as OrMenuItemV3 } from './OrMenuItem-dbee450f.js';
-export { s as OrMenuV3 } from './OrMenu-053a9ab7.js';
+export { s as OrMenuV3 } from './OrMenu-70cee836.js';
 export { P as MenuPlacement, s as OrPopoverV3, P as PopoverPlacement, a as PopoverVariant, P as TooltipPlacement } from './OrPopover-3ac8f589.js';
 export { s as OrModal, O as OrModalSizes } from './OrModal-f3b2e0f4.js';
 export { M as ModalSize, s as OrModalV3 } from './OrModal-7d4158d1.js';
@@ -56,7 +56,7 @@ export { s as OrNumberInput } from './OrNumberInput-dca5e850.js';
 export { s as OrOverflowMenu } from './OrOverflowMenu-08626d66.js';
 export { s as OrOverlay } from './OrOverlay-451dce49.js';
 export { s as OrOverlayV3 } from './OrOverlay-7cf03aea.js';
-export { s as OrPaginationV3 } from './OrPagination-f2d104d9.js';
+export { s as OrPaginationV3 } from './OrPagination-7f4ed166.js';
 export { s as OrPassword } from './OrPassword-4a37f3ac.js';
 export { s as OrProgress, O as OrProgressColors, a as OrProgressTypes } from './OrProgress-d0d52c86.js';
 export { s as OrProgressV3, P as ProgressColor, a as ProgressType } from './OrProgress-33cf7445.js';
@@ -82,7 +82,7 @@ export { s as OrTab } from './OrTab-bc98be02.js';
 export { s as OrTabHeaderItem } from './OrTabHeaderItem-d668cc59.js';
 export { s as OrTabV3 } from './OrTab-c11d94f6.js';
 export { s as OrTabs } from './OrTabs-d3812c11.js';
-export { s as OrTabsV3, T as TabsVariant } from './OrTabs-d9e2a07e.js';
+export { s as OrTabsV3, T as TabsVariant } from './OrTabs-0a5c80be.js';
 export { s as OrTag } from './OrTag-2192a3cf.js';
 export { s as OrTagV3, a as TagColor, T as TagVariant } from './OrTag-1b49531d.js';
 export { s as OrTeleport } from './OrTeleport.vue3-9bce0c02.js';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@onereach/ui-components",
-  "version": "3.0.4-beta.2486.0",
+  "version": "3.0.4-beta.2487.0",
   "description": "Vue components library for v2/3",
   "sideEffects": false,
   "main": "./dist/auto/index.js",
@@ -38,7 +38,7 @@
     "@codemirror/lang-json": "6.0.0",
     "@codemirror/lang-markdown": "6.0.1",
     "@floating-ui/dom": "0.3.1",
-    "@onereach/styles": "^2.37.4-beta.2486.0",
+    "@onereach/styles": "^2.37.4-beta.2487.0",
     "@splidejs/splide": "4.0.6",
     "@types/lodash": "4.14.173",
     "@types/sortablejs": "1.10.7",

package/src/components/or-date-time-picker-v3/OrDateTimePicker.vue

@@ -67,11 +67,12 @@
           </OrDateTimePickerMobileControl>
         </OrDateTimePickerPopoverHeader>
 
-        <OrDateTimePickerMonthSelect v-model="proxyModelValue" />
-        <OrDateTimePickerDateSelect v-model="proxyModelValue" />
+        <OrDateTimePickerMonthSelect v-model="draftModelValue" />
+        <OrDateTimePickerDaySelect v-model="draftModelValue" />
 
         <OrDateTimePickerPopoverFooter
-          @reject="closeDatePopover()"
+          @resolve="proxyModelValue = draftModelValue; datePopover.close()"
+          @reject="draftModelValue = proxyModelValue; datePopover.close()"
         />
       </OrPopover>
 
@@ -91,10 +92,11 @@
           </OrDateTimePickerMobileControl>
         </OrDateTimePickerPopoverHeader>
 
-        <OrDateTimePickerTimeSelect v-model="proxyModelValue" />
+        <OrDateTimePickerTimeSelect v-model="draftModelValue" />
 
         <OrDateTimePickerPopoverFooter
-          @reject="closeTimePopover()"
+          @resolve="proxyModelValue = draftModelValue; timePopover.close()"
+          @reject="draftModelValue = proxyModelValue; timePopover.close()"
         />
       </OrPopover>
 
@@ -129,7 +131,7 @@
 </template>
 
 <script lang="ts">
-import { computed, defineComponent, PropType, reactive, ref } from 'vue-demi';
+import { computed, defineComponent, PropType, reactive, ref, watch } from 'vue-demi';
 import { DateTimePickerSize } from '.';
 import { DropdownClose, DropdownOpen } from '../../directives';
 import { useControlAttributes, useIdAttribute, useValidationAttributes } from '../../hooks';
@@ -139,7 +141,7 @@ import { OrIconButtonV3 as OrIconButton } from '../or-icon-button-v3';
 import { OrInputBoxV3 as OrInputBox } from '../or-input-box-v3';
 import { OrLabelV3 as OrLabel } from '../or-label-v3';
 import { OrPopoverV3 as OrPopover } from '../or-popover-v3';
-import OrDateTimePickerDateSelect from './partials/or-date-time-picker-date-select/OrDateTimePickerDateSelect.vue';
+import OrDateTimePickerDaySelect from './partials/or-date-time-picker-day-select/OrDateTimePickerDaySelect.vue';
 import OrDateTimePickerMobileControl from './partials/or-date-time-picker-mobile-control/OrDateTimePickerMobileControl.vue';
 import OrDateTimePickerMonthSelect from './partials/or-date-time-picker-month-select/OrDateTimePickerMonthSelect.vue';
 import OrDateTimePickerPopoverFooter from './partials/or-date-time-picker-popover-footer/OrDateTimePickerPopoverFooter.vue';
@@ -151,7 +153,7 @@ export default defineComponent({
   name: 'OrDateTimePicker',
 
   components: {
-    OrDateTimePickerDateSelect,
+    OrDateTimePickerDaySelect,
     OrDateTimePickerMobileControl,
     OrDateTimePickerMonthSelect,
     OrDateTimePickerPopoverFooter,
@@ -276,6 +278,12 @@ export default defineComponent({
       },
     });
 
+    const draftModelValue = ref<Date>();
+
+    watch(proxyModelValue, (value) => {
+      draftModelValue.value = value;
+    }, { immediate: true });
+
     // Methods
     function toggleDatePopover(): void {
       if (!props.readonly && !props.disabled) {
@@ -333,6 +341,7 @@ export default defineComponent({
       controlStyles,
       controlAttributes,
       proxyModelValue,
+      draftModelValue,
       toggleDatePopover,
       toggleTimePopover,
       closeDatePopover,

package/src/components/or-date-time-picker-v3/hooks/useDefaultDate.ts

@@ -0,0 +1,3 @@
+export function useDefaultDate(): number {
+  return new Date().getUTCDate();
+}

package/src/components/or-date-time-picker-v3/hooks/useDefaultHours.ts

@@ -0,0 +1,3 @@
+export function useDefaultHours(): number {
+  return 0;
+}

package/src/components/or-date-time-picker-v3/hooks/useDefaultMinutes.ts

@@ -0,0 +1,3 @@
+export function useDefaultMinutes(): number {
+  return 0;
+}

package/src/components/or-date-time-picker-v3/hooks/useDefaultMonth.ts

@@ -0,0 +1,3 @@
+export function useDefaultMonth(): number {
+  return new Date().getUTCMonth();
+}

package/src/components/or-date-time-picker-v3/hooks/useDefaultYear.ts

@@ -0,0 +1,3 @@
+export function useDefaultYear(): number {
+  return new Date().getUTCFullYear();
+}