@onereach/ui-components 10.0.2 → 10.1.0-beta.4242.0

package/dist/bundled/v3/index.js

@@ -4,23 +4,23 @@ export { a as AvatarColor, A as AvatarSize, s as OrAvatarV3 } from './components
 export { OrButton, OrButtonColors, OrButtonSizes, OrButtonViews } from './components/OrButton/index.js';
 export { s as OrButtonGroupV3 } from './components/OrButtonGroupV3-11aadc91.js';
 export { CARD_COLLECTION_LAYOUT, OrCardCollection } from './components/OrCardCollection/index.js';
-export { C as CardCollectionView, s as OrCardCollectionV3, d as defaultViewModes, g as gridView, l as listView } from './components/OrCardCollectionV3-7416a26d.js';
+export { C as CardCollectionView, s as OrCardCollectionV3, d as defaultViewModes, g as gridView, l as listView } from './components/OrCardCollectionV3-8a2f7f68.js';
 export { C as CardPadding, s as OrCardV3 } from './components/OrCardV3-a0e51677.js';
 export { default as OrCheckboxGroupV3 } from './components/OrCheckboxGroupV3/OrCheckboxGroup.js';
 export { s as OrChip, a as OrChips } from './components/OrChips-ca0f1380.js';
 export { a as EditorState, E as EditorView, q as OrCode, O as OrCodeLanguages, b as basicSetup, h as html, j as javascript, d as json, e as jsonParseLinter, c as lintGutter, l as linter } from './components/OrCode-3167b862.js';
-export { C as CodeLanguage, s as OrCodeV3 } from './components/OrCodeV3-5b8b5a7a.js';
+export { C as CodeLanguage, s as OrCodeV3 } from './components/OrCodeV3-782af0c4.js';
 export { s as OrColorPicker, h as amber, n as black, b as blue, m as blueGrey, k as brown, c as cyan, j as deepOrange, d as deepPurple, g as green, i as indigo, l as lightBlue, e as lightGreen, f as lime, o as orange, p as pink, a as purple, r as red, t as teal, w as white, y as yellow } from './components/OrColorPicker-788c515b.js';
-export { s as OrCombinedInputV3 } from './components/OrCombinedInputV3-d6f24b0f.js';
+export { s as OrCombinedInputV3 } from './components/OrCombinedInputV3-933f1920.js';
 export { s as OrConfirm } from './components/OrConfirm-6b540d56.js';
-export { C as ConfirmType, s as OrConfirmV3 } from './components/OrConfirmV3-882d8f35.js';
+export { C as ConfirmType, s as OrConfirmV3 } from './components/OrConfirmV3-bd6d7a69.js';
 export { default as OrContextMenuV3 } from './components/OrContextMenuV3/OrContextMenu.js';
-export { s as OrDateFormatV3 } from './components/OrDateFormatV3-3000643b.js';
-export { s as OrDatePickerV3 } from './components/OrDatePickerV3-d5f8c11a.js';
-export { s as OrDateRangePickerV3 } from './components/OrDateRangePickerV3-e62adab9.js';
-export { s as OrDateTimeFormatV3 } from './components/OrDateTimeFormatV3-1ff1795b.js';
+export { s as OrDateFormatV3 } from './components/OrDateFormatV3-79a25ac8.js';
+export { s as OrDatePickerV3 } from './components/OrDatePickerV3-7e493ca1.js';
+export { s as OrDateRangePickerV3 } from './components/OrDateRangePickerV3-f215b1ba.js';
+export { s as OrDateTimeFormatV3 } from './components/OrDateTimeFormatV3-57c82e28.js';
 export { D as DEFAULT_TEXT, s as OrDateTimePicker, n as OrDateTimePickerItemTypes, O as OrDateTimePickerTypes } from './components/OrDateTimePicker-a323d4d7.js';
-export { D as DateTimePickerTimeFormat, s as OrDateTimePickerDateControl, a as OrDateTimePickerDateSelect, b as OrDateTimePickerMobileControl, c as OrDateTimePickerMonthSelect, d as OrDateTimePickerPopoverFooter, e as OrDateTimePickerPopoverHeader, j as OrDateTimePickerTimeControl, k as OrDateTimePickerTimeSelect, l as OrDateTimePickerV3, f as formatDate, i as formatTime, g as getCurrentDate, m as getDatePlaceholder, h as getNextMonthDate, n as getTimePlaceholder } from './components/OrDateTimePickerV3-84c0fee3.js';
+export { D as DateFormat, a as DateTimePickerDateFormat, j as DateTimePickerTimeFormat, L as Locale, s as OrDateTimePickerDateControl, b as OrDateTimePickerDateSelect, c as OrDateTimePickerMobileControl, d as OrDateTimePickerMonthSelect, e as OrDateTimePickerPopoverFooter, g as OrDateTimePickerPopoverHeader, l as OrDateTimePickerTimeControl, m as OrDateTimePickerTimeSelect, n as OrDateTimePickerV3, T as TimeFormat, f as formatDate, k as formatTime, h as getCurrentDate, o as getDatePlaceholder, i as getNextMonthDate, p as getTimePlaceholder } from './components/OrDateTimePickerV3-345a6c12.js';
 export { D as DropAreaSize, s as OrDropAreaV3, a as approximateFileSize } from './components/OrDropAreaV3-af26944d.js';
 export { E as EditorTabsOverflow, s as OrEditorTabsV3 } from './components/OrEditorTabsV3-b948d282.js';
 export { E as EmptyStateSize, s as OrEmptyStateV3 } from './components/OrEmptyStateV3-af47ab45.js';
@@ -31,7 +31,7 @@ export { InlineTextEditTrimmingTypes, InlineTextEditTypes, OrInlineTextEdit } fr
 export { s as OrInlineTextareaV3 } from './components/OrInlineTextareaV3-d7098aac.js';
 export { L as LinkColor, s as OrLinkV3 } from './components/OrLinkV3-56763fd9.js';
 export { default as OrListOfInputs } from './components/OrListOfInputs/OrListOfInputs.js';
-export { a as OrListItem, s as OrListV3 } from './components/OrListV3-62e510b2.js';
+export { a as OrListItem, s as OrListV3 } from './components/OrListV3-02565baf.js';
 export { OR_NOTIFICATION_SIZE, OR_NOTIFICATION_TYPE, OrNotification } from './components/OrNotification/index.js';
 export { N as NotificationVariant, s as OrNotificationV3 } from './components/OrNotificationV3-bd490a7e.js';
 export { default as OrNumberInput } from './components/OrNumberInput/OrNumberInput.js';
@@ -44,10 +44,10 @@ export { default as OrRadioGroup } from './components/OrRadioGroup/OrRadioGroup.
 export { default as OrRadioGroupV3 } from './components/OrRadioGroupV3/OrRadioGroup.js';
 export { s as OrRangeSliderV3 } from './components/OrRangeSliderV3-a7814bc6.js';
 export { s as OrRatingV3 } from './components/OrRatingV3-82a538ca.js';
-export { F as Formats, s as OrRichTextEditorV3 } from './components/OrRichTextEditorV3-01acbe53.js';
+export { F as Formats, s as OrRichTextEditorV3 } from './components/OrRichTextEditorV3-cbaf6f09.js';
 export { s as OrSegmentedControlV3, S as SegmentedControlSize } from './components/OrSegmentedControlV3-de9f3667.js';
 export { s as OrSelect } from './components/OrSelect-86d9116f.js';
-export { s as OrSelectV3 } from './components/OrSelectV3-7888ad93.js';
+export { s as OrSelectV3 } from './components/OrSelectV3-c63decef.js';
 export { OrSidebar, OrSidebarSide } from './components/OrSidebar/index.js';
 export { s as OrSidebarV3, S as SidebarPlacement } from './components/OrSidebarV3-7e1363e6.js';
 export { s as OrSkeletonCircle, a as OrSkeletonRect, b as OrSkeletonText, O as OrSkeletonTextSizes } from './components/OrSkeleton-3e0bd913.js';
@@ -57,19 +57,19 @@ export { s as OrSliderV3, a as SliderColor, S as SliderOrientation } from './com
 export { s as OrStatusV3, a as StatusSize, S as StatusVariant } from './components/OrStatusV3-c312005c.js';
 export { default as OrStepper } from './components/OrStepper/OrStepper.js';
 export { default as OrSwitch } from './components/OrSwitch/OrSwitch.js';
-export { s as OrSwitchV3 } from './components/OrSwitchV3-2fa19537.js';
+export { s as OrSwitchV3 } from './components/OrSwitchV3-efb0189f.js';
 export { default as OrTab } from './components/OrTab/OrTab.js';
 export { default as OrTabs } from './components/OrTabs/OrTabs.js';
 export { s as OrTabsV3, T as TabsVariant } from './components/OrTabsV3-2016c95b.js';
 export { default as OrTag } from './components/OrTag/OrTag.js';
-export { s as OrTagInputV3 } from './components/OrTagInputV3-1dadfcfd.js';
+export { s as OrTagInputV3 } from './components/OrTagInputV3-591da379.js';
 export { s as OrTextV3 } from './components/OrTextV3-f2e88ff5.js';
 export { default as OrTextarea } from './components/OrTextarea/OrTextarea.js';
-export { s as OrTextareaV3 } from './components/OrTextareaV3-4a8136b0.js';
+export { s as OrTextareaV3 } from './components/OrTextareaV3-e2e9affb.js';
 export { OrTextbox, TextboxTypes } from './components/OrTextbox/index.js';
-export { s as OrTimeFormatV3 } from './components/OrTimeFormatV3-1a6191e2.js';
-export { s as OrTimePickerV3 } from './components/OrTimePickerV3-ac66eecb.js';
-export { s as OrTimeRangePickerV3 } from './components/OrTimeRangePickerV3-ea15e8da.js';
+export { s as OrTimeFormatV3 } from './components/OrTimeFormatV3-9d2eeebc.js';
+export { s as OrTimePickerV3 } from './components/OrTimePickerV3-973014d4.js';
+export { s as OrTimeRangePickerV3 } from './components/OrTimeRangePickerV3-b5c80254.js';
 export { s as OrToast, a as OrToastContainer, P as PositionsX, c as PositionsY, d as ToastType, T as TransitionType, b as useQueue, u as useToast } from './components/OrToast-0dfa6e4e.js';
 export { a as OrToastContainerV3, s as OrToastV3, p as PropsV3, t as TypesV3, b as useQueueV3, u as useToastV3 } from './components/OrToastV3-c423f82c.js';
 export { OrTreeV3, TreeNodeDropPosition } from './components/OrTreeV3/index.js';
@@ -79,14 +79,14 @@ export { default as OrIconButton, default as OrIconButtonV2 } from './components
 export { a as ButtonColor, b as ButtonType, B as ButtonVariant, s as OrButtonV3 } from './components/OrButtonV3-a90c86d5.js';
 export { default as OrCard } from './components/OrCard/OrCard.js';
 export { default as OrCheckbox } from './components/OrCheckbox/OrCheckbox.js';
-export { s as OrCheckboxTreeV3 } from './components/OrCheckboxTreeV3-4635160f.js';
-export { s as OrCheckboxV3 } from './components/OrCheckboxV3-69269b9c.js';
+export { s as OrCheckboxTreeV3 } from './components/OrCheckboxTreeV3-a4d5bc04.js';
+export { s as OrCheckboxV3 } from './components/OrCheckboxV3-50db4f65.js';
 export { default as OrCollapse } from './components/OrCollapse/OrCollapse.js';
 export { default as OrError } from './components/OrError/OrError.js';
 export { s as OrErrorV3 } from './components/OrErrorV3-b04d76aa.js';
 export { b as ExpansionPanelBackgroundColor, a as ExpansionPanelColor, E as ExpansionPanelVariant, s as OrExpansionPanelV3 } from './components/OrExpansionPanelV3-f820fb10.js';
 export { s as OrFloating, e as OrFloatingHideStrategy, O as OrFloatingPlacements } from './components/OrFloating-9b3e2ca1.js';
-export { F as FormGroupDirection, s as OrFormGroupV3 } from './components/OrFormGroupV3-7d09a939.js';
+export { F as FormGroupDirection, s as OrFormGroupV3 } from './components/OrFormGroupV3-72dc8852.js';
 export { default as OrHint } from './components/OrHint/OrHint.js';
 export { s as OrHintV3 } from './components/OrHintV3-c8ac5975.js';
 export { OrIcon, OrIconColors, OrIconType } from './components/OrIcon/index.js';
@@ -95,9 +95,9 @@ export { I as IconSize, a as IconVariant, s as OrIconV3 } from './components/OrI
 export { I as InlineInputBoxSize, s as OrInlineInputBoxV3 } from './components/OrInlineInputBoxV3-1a4d3924.js';
 export { default as OrInput } from './components/OrInput/OrInput.js';
 export { I as InputBoxSize, a as InputBoxVariant, s as OrInputBoxV3 } from './components/OrInputBoxV3-dbc63649.js';
-export { I as InputType, s as OrInputV3 } from './components/OrInputV3-db89dfb7.js';
+export { I as InputType, s as OrInputV3 } from './components/OrInputV3-ac1c7fe7.js';
 export { default as OrLabel } from './components/OrLabel/OrLabel.js';
-export { L as LabelVariant, s as OrLabelV3 } from './components/OrLabelV3-b1cd132a.js';
+export { L as LabelVariant, s as OrLabelV3 } from './components/OrLabelV3-23a42d9d.js';
 export { s as OrList } from './components/OrList-76d6ce56.js';
 export { LoaderViews, OrLoader } from './components/OrLoader/index.js';
 export { a as LoaderColor, b as LoaderSize, L as LoaderVariant, s as OrLoaderV3 } from './components/OrLoaderV3-0081e944.js';
@@ -109,7 +109,7 @@ export { default as OrOverlay } from './components/OrOverlay/OrOverlay.js';
 export { s as OrOverlayV3 } from './components/OrOverlayV3-fc3627aa.js';
 export { s as OrPopoverV3, P as PopoverPlacement, a as PopoverVariant, i as isPrevented } from './components/OrPopoverV3-3e80d95c.js';
 export { s as OrProgress, O as OrProgressColors, a as OrProgressTypes } from './components/OrProgress-2259f090.js';
-export { s as OrRadioV3 } from './components/OrRadioV3-e9c05c7b.js';
+export { s as OrRadioV3 } from './components/OrRadioV3-0e34f4d0.js';
 export { s as OrResizeablePanelV3, R as ResizeablePanelPadding, a as ResizeablePanelPlacement } from './components/OrResizeablePanelV3-cd4756a2.js';
 export { default as OrSearch } from './components/OrSearch/OrSearch.js';
 export { default as OrSearchV3 } from './components/OrSearchV3/OrSearch.js';

package/dist/esm/v2/{OrCardCollection-dae2f81d.js → OrCardCollection-cd033a01.js}

@@ -1,7 +1,7 @@
 import { defineComponent, computed, ref, watch } from 'vue-demi';
 import { _ as __vue_component__$2 } from './OrIconButton-956b8e5c.js';
 import { _ as __vue_component__$5 } from './OrLoader-4ac49224.js';
-import { _ as __vue_component__$4 } from './OrSearch-5dd1820f.js';
+import { _ as __vue_component__$4 } from './OrSearch-493eb34d.js';
 import { _ as __vue_component__$3 } from './OrSorting-9f4cab5c.js';
 import { n as normalizeComponent } from './normalize-component-6e8e3d80.js';
 

package/dist/esm/v2/{OrCheckbox-2e14d995.js → OrCheckbox-8cdfdc56.js}

@@ -6,7 +6,7 @@ import { i as isVoid } from './isVoid-36a1480c.js';
 import { u as useProxyModelValue } from './useProxyModelValue-940010d2.js';
 import '@onereach/styles/tailwind/plugins/core';
 import '@onereach/styles/tailwind.config.json';
-import { _ as __vue_component__$1, L as LabelVariant } from './OrLabel-113eae8d.js';
+import { _ as __vue_component__$1, L as LabelVariant } from './OrLabel-b0805497.js';
 import { s as styleInject } from './style-inject.es-4c6f2515.js';
 import { n as normalizeComponent } from './normalize-component-6e8e3d80.js';
 

package/dist/esm/v2/{OrCheckboxGroup-4c3c1418.js → OrCheckboxGroup-4a817c00.js}

@@ -4,8 +4,8 @@ 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 { _ as __vue_component__$1 } from './OrCheckboxTree-9613ade5.js';
-import { _ as __vue_component__$2, F as FormGroupDirection } from './OrFormGroup-d8b290f4.js';
+import { _ as __vue_component__$1 } from './OrCheckboxTree-338b5ff4.js';
+import { _ as __vue_component__$2, F as FormGroupDirection } from './OrFormGroup-936aa0ff.js';
 import { n as normalizeComponent } from './normalize-component-6e8e3d80.js';
 
 var script = defineComponent({

package/dist/esm/v2/{OrCheckboxTree-9613ade5.js → OrCheckboxTree-338b5ff4.js}

@@ -6,7 +6,7 @@ import '@onereach/styles/tailwind/plugins/core';
 import '@onereach/styles/tailwind.config.json';
 import { _ as __vue_component__$3 } from './OrButton-e4e85817.js';
 import './OrButton.vue_rollup-plugin-vue_script-199bb600.js';
-import { _ as __vue_component__$2 } from './OrCheckbox-2e14d995.js';
+import { _ as __vue_component__$2 } from './OrCheckbox-8cdfdc56.js';
 import { _ as __vue_component__$1 } from './OrIcon-03e3c802.js';
 import { n as normalizeComponent } from './normalize-component-6e8e3d80.js';
 

package/dist/esm/v2/{OrCode-bab23c65.js → OrCode-06a15a0c.js}

@@ -16,7 +16,7 @@ import { _ as __vue_component__$2 } from './OrError-b25d782d.js';
 import { _ as __vue_component__$3 } from './OrHint-2fe1157b.js';
 import { _ as __vue_component__$4 } from './OrInputBox-1a8fda9b.js';
 import './OrInputBox.vue_rollup-plugin-vue_script-8c39b9ca.js';
-import { _ as __vue_component__$5 } from './OrLabel-113eae8d.js';
+import { _ as __vue_component__$5 } from './OrLabel-b0805497.js';
 import { n as normalizeComponent } from './normalize-component-6e8e3d80.js';
 
 const Code = [

package/dist/esm/v2/{OrCombinedInput-e3f4498e.js → OrCombinedInput-79d57e49.js}

@@ -2,7 +2,7 @@ import { defineComponent, ref, computed } from 'vue-demi';
 import { _ as __vue_component__$1 } from './OrError-b25d782d.js';
 import { _ as __vue_component__$2 } from './OrHint-2fe1157b.js';
 import { a as InputBoxSize } from './OrInputBox.vue_rollup-plugin-vue_script-8c39b9ca.js';
-import { _ as __vue_component__$3 } from './OrLabel-113eae8d.js';
+import { _ as __vue_component__$3 } from './OrLabel-b0805497.js';
 import { n as normalizeComponent } from './normalize-component-6e8e3d80.js';
 
 const CombinedInput = [

package/dist/esm/v2/{OrConfirm-4561fd88.js → OrConfirm-121af86c.js}

@@ -7,7 +7,7 @@ import '@onereach/styles/tailwind/plugins/core';
 import '@onereach/styles/tailwind.config.json';
 import { _ as __vue_component__$2 } from './OrButton-e4e85817.js';
 import { a as ButtonColor } from './OrButton.vue_rollup-plugin-vue_script-199bb600.js';
-import { _ as __vue_component__$3 } from './OrInput-43f90e4a.js';
+import { _ as __vue_component__$3 } from './OrInput-431ae55a.js';
 import { _ as __vue_component__$1 } from './OrOverlay-7940a4f4.js';
 import { n as normalizeComponent } from './normalize-component-6e8e3d80.js';
 

package/dist/esm/v2/{OrDateFormat-7b761b0f.js → OrDateFormat-a17b5b23.js}

@@ -1,7 +1,7 @@
-import { defineComponent, ref, computed } from 'vue-demi';
-import './OrDateTimePicker.vue_rollup-plugin-vue_script-bd0836fd.js';
-import './OrDateTimePickerTimeSelect-2f7efc41.js';
-import { f as formatDate } from './getTimePlaceholder-a1d75821.js';
+import { defineComponent, ref, computed, inject } from 'vue-demi';
+import { D as DateFormat$1, L as Locale } from './OrDateTimePicker.vue_rollup-plugin-vue_script-b7ca34e8.js';
+import './OrDateTimePickerTimeSelect-3fa9a7c7.js';
+import { D as DateTimePickerDateFormat, f as formatDate } from './getTimePlaceholder-9d18b5ac.js';
 import { n as normalizeComponent } from './normalize-component-6e8e3d80.js';
 
 const DateFormat = [
@@ -16,7 +16,15 @@ var script = defineComponent({
   },
   props: {
     modelValue: {
-      type: Date,
+      type: undefined,
+      default: undefined
+    },
+    format: {
+      type: String,
+      default: undefined
+    },
+    locale: {
+      type: String,
       default: undefined
     },
     placeholder: {
@@ -25,14 +33,24 @@ var script = defineComponent({
     }
   },
   expose: ['root'],
-  setup() {
-    // Refs
+  setup(props) {
+    // Refs & Styles
     const root = ref();
-    // Styles
     const rootStyles = computed(() => ['or-date-format-v3', ...DateFormat]);
+    // Options
+    const resolvedFormat = computed(() => {
+      var _a;
+      return (_a = props.format) !== null && _a !== void 0 ? _a : inject(DateFormat$1, DateTimePickerDateFormat.Short);
+    });
+    const resolvedLocale = computed(() => {
+      var _a;
+      return (_a = props.locale) !== null && _a !== void 0 ? _a : inject(Locale, navigator.language);
+    });
     return {
       root,
       rootStyles,
+      resolvedFormat,
+      resolvedLocale,
       formatDate
     };
   }
@@ -49,7 +67,7 @@ var __vue_render__ = function () {
   return _c('div', {
     ref: 'root',
     class: _vm.rootStyles
-  }, [_vm._v("\n  " + _vm._s(_vm.modelValue ? _vm.formatDate(_vm.modelValue) : _vm.placeholder) + "\n")]);
+  }, [_vm.modelValue ? [_vm._v("\n    " + _vm._s(_vm.formatDate(_vm.modelValue, _vm.resolvedFormat, _vm.resolvedLocale)) + "\n  ")] : [_vm._v("\n    " + _vm._s(_vm.placeholder) + "\n  ")]], 2);
 };
 var __vue_staticRenderFns__ = [];
 

package/dist/esm/v2/{OrDatePicker-847e9db1.js → OrDatePicker-67c281d7.js}

@@ -1,13 +1,13 @@
-import { defineComponent, ref, computed, watch, toRef } from 'vue-demi';
+import { defineComponent, ref, computed, inject, watch, toRef } from 'vue-demi';
 import { D as DropdownClose, a as DropdownOpen } from './dropdown-open-06d651cf.js';
 import '@vueuse/core';
 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 './OrDateTimePicker.vue_rollup-plugin-vue_script-bd0836fd.js';
-import { _ as __vue_component__$1, a as __vue_component__$2, b as __vue_component__$3, c as __vue_component__$4, d as __vue_component__$5, e as __vue_component__$6 } from './OrDateTimePickerTimeSelect-2f7efc41.js';
-import './getTimePlaceholder-a1d75821.js';
+import { D as DateFormat, L as Locale } from './OrDateTimePicker.vue_rollup-plugin-vue_script-b7ca34e8.js';
+import { _ as __vue_component__$1, a as __vue_component__$2, b as __vue_component__$3, c as __vue_component__$4, d as __vue_component__$5, e as __vue_component__$6 } from './OrDateTimePickerTimeSelect-3fa9a7c7.js';
+import { D as DateTimePickerDateFormat } from './getTimePlaceholder-9d18b5ac.js';
 import { g as getCurrentDate } from './getCurrentDate-046a888d.js';
 import { _ as __vue_component__$7 } from './OrError-b25d782d.js';
 import { _ as __vue_component__$8 } from './OrHint-2fe1157b.js';
@@ -15,7 +15,7 @@ import { _ as __vue_component__$a } from './OrIconButton-956b8e5c.js';
 import { _ as __vue_component__$9 } from './OrIcon-03e3c802.js';
 import { _ as __vue_component__$b } from './OrInputBox-1a8fda9b.js';
 import { a as InputBoxSize } from './OrInputBox.vue_rollup-plugin-vue_script-8c39b9ca.js';
-import { _ as __vue_component__$c } from './OrLabel-113eae8d.js';
+import { _ as __vue_component__$c } from './OrLabel-b0805497.js';
 import { _ as __vue_component__$d } from './OrPopover-592f7ad2.js';
 import { n as normalizeComponent } from './normalize-component-6e8e3d80.js';
 
@@ -55,7 +55,15 @@ var script = defineComponent({
   },
   props: {
     modelValue: {
-      type: Date,
+      type: undefined,
+      default: undefined
+    },
+    format: {
+      type: String,
+      default: undefined
+    },
+    locale: {
+      type: String,
       default: undefined
     },
     yearFilter: {
@@ -107,8 +115,9 @@ var script = defineComponent({
   expose: ['root', 'focus', 'blur'],
   setup(props, context) {
     var _a;
-    // Refs
+    // Refs & Styles
     const root = ref();
+    const rootStyles = computed(() => ['or-date-picker-v3', ...DatePicker]);
     const inputBox = ref();
     const inputBoxRoot = computed(() => {
       var _a;
@@ -119,9 +128,16 @@ var script = defineComponent({
       var _a;
       return (_a = popover.value) === null || _a === void 0 ? void 0 : _a.state;
     });
-    // Styles
-    const rootStyles = computed(() => ['or-date-picker-v3', ...DatePicker]);
     const popoverStyles = computed(() => ['or-date-picker-popover-v3', ...DatePickerPopover]);
+    // Options
+    const resolvedFormat = computed(() => {
+      var _a;
+      return (_a = props.format) !== null && _a !== void 0 ? _a : inject(DateFormat, DateTimePickerDateFormat.Short);
+    });
+    const resolvedLocale = computed(() => {
+      var _a;
+      return (_a = props.locale) !== null && _a !== void 0 ? _a : inject(Locale, navigator.language);
+    });
     // State
     const initialValue = ref((_a = props.modelValue) !== null && _a !== void 0 ? _a : getCurrentDate());
     watch(() => props.modelValue, value => {
@@ -170,19 +186,21 @@ var script = defineComponent({
     }
     function formatDateAlt(value) {
       var _a;
-      return (_a = value === null || value === void 0 ? void 0 : value.toLocaleString(navigator.language, {
+      return (_a = value === null || value === void 0 ? void 0 : value.toLocaleString(resolvedLocale.value, {
         dateStyle: 'medium',
         timeZone: 'UTC'
       })) !== null && _a !== void 0 ? _a : '--';
     }
     return {
       root,
+      rootStyles,
       inputBox,
       inputBoxRoot,
       popover,
       popoverState,
-      rootStyles,
       popoverStyles,
+      resolvedFormat,
+      resolvedLocale,
       initialValue,
       proxyModelValue,
       draftModelValue,
@@ -280,6 +298,8 @@ var __vue_render__ = function () {
     }],
     class: ['!border-0'],
     attrs: {
+      "format": _vm.resolvedFormat,
+      "locale": _vm.resolvedLocale,
       "selected": _vm.popover && _vm.popover.state === 'open',
       "required": _vm.required,
       "readonly": _vm.readonly,
@@ -316,6 +336,7 @@ var __vue_render__ = function () {
     }
   }, [_vm._v("\n          " + _vm._s(_vm.formatDateAlt(_vm.draftModelValue)) + "\n        ")])], 1), _vm._v(" "), _c('OrDateTimePickerMonthSelect', {
     attrs: {
+      "locale": _vm.resolvedLocale,
       "year-filter": _vm.yearFilter,
       "month-filter": _vm.monthFilter
     },
@@ -329,6 +350,8 @@ var __vue_render__ = function () {
   }), _vm._v(" "), _c('OrDateTimePickerDateSelect', {
     attrs: {
       "initial-value": _vm.initialValue,
+      "format": _vm.resolvedFormat,
+      "locale": _vm.resolvedLocale,
       "date-filter": _vm.dateFilter
     },
     model: {

package/dist/esm/v2/{OrDateRangePicker-01c5a09c.js → OrDateRangePicker-4d776fe2.js}

@@ -1,13 +1,13 @@
-import { defineComponent, ref, computed, watch, toRef } from 'vue-demi';
+import { defineComponent, ref, computed, inject, watch, toRef } from 'vue-demi';
 import { D as DropdownClose, a as DropdownOpen } from './dropdown-open-06d651cf.js';
 import '@vueuse/core';
 import './dom-aecadd9a.js';
 import { u as useProxyModelValue } from './useProxyModelValue-940010d2.js';
 import { u as useResponsive } from './useResponsive-1baf3485.js';
 import '@onereach/styles/tailwind.config.json';
-import './OrDateTimePicker.vue_rollup-plugin-vue_script-bd0836fd.js';
-import { _ as __vue_component__$1, a as __vue_component__$2, b as __vue_component__$3, c as __vue_component__$4, d as __vue_component__$5, e as __vue_component__$6 } from './OrDateTimePickerTimeSelect-2f7efc41.js';
-import './getTimePlaceholder-a1d75821.js';
+import { D as DateFormat, L as Locale } from './OrDateTimePicker.vue_rollup-plugin-vue_script-b7ca34e8.js';
+import { _ as __vue_component__$1, a as __vue_component__$2, b as __vue_component__$3, c as __vue_component__$4, d as __vue_component__$5, e as __vue_component__$6 } from './OrDateTimePickerTimeSelect-3fa9a7c7.js';
+import { D as DateTimePickerDateFormat } from './getTimePlaceholder-9d18b5ac.js';
 import { g as getCurrentDate } from './getCurrentDate-046a888d.js';
 import { g as getNextMonthDate } from './getNextMonthDate-00c47169.js';
 import { _ as __vue_component__$7 } from './OrError-b25d782d.js';
@@ -16,7 +16,7 @@ import { _ as __vue_component__$a } from './OrIconButton-956b8e5c.js';
 import { _ as __vue_component__$9 } from './OrIcon-03e3c802.js';
 import { _ as __vue_component__$b } from './OrInputBox-1a8fda9b.js';
 import { a as InputBoxSize } from './OrInputBox.vue_rollup-plugin-vue_script-8c39b9ca.js';
-import { _ as __vue_component__$c } from './OrLabel-113eae8d.js';
+import { _ as __vue_component__$c } from './OrLabel-b0805497.js';
 import { _ as __vue_component__$d } from './OrPopover-592f7ad2.js';
 import { n as normalizeComponent } from './normalize-component-6e8e3d80.js';
 
@@ -56,7 +56,15 @@ var script = defineComponent({
   },
   props: {
     modelValue: {
-      type: Object,
+      type: undefined,
+      default: undefined
+    },
+    format: {
+      type: String,
+      default: undefined
+    },
+    locale: {
+      type: String,
       default: undefined
     },
     size: {
@@ -96,8 +104,9 @@ var script = defineComponent({
   expose: ['root', 'focus', 'blur'],
   setup(props, context) {
     var _a, _b, _c, _d, _e;
-    // Refs
+    // Refs & Styles
     const root = ref();
+    const rootStyles = computed(() => ['or-date-range-picker-v3', ...DateRangePicker]);
     const inputBox = ref();
     const inputBoxRoot = computed(() => {
       var _a;
@@ -108,9 +117,16 @@ var script = defineComponent({
       var _a;
       return (_a = popover.value) === null || _a === void 0 ? void 0 : _a.state;
     });
-    // Styles
-    const rootStyles = computed(() => ['or-date-range-picker-v3', ...DateRangePicker]);
     const popoverStyles = computed(() => ['or-date-range-picker-popover-v3', ...DateRangePickerPopover]);
+    // Options
+    const resolvedFormat = computed(() => {
+      var _a;
+      return (_a = props.format) !== null && _a !== void 0 ? _a : inject(DateFormat, DateTimePickerDateFormat.Short);
+    });
+    const resolvedLocale = computed(() => {
+      var _a;
+      return (_a = props.locale) !== null && _a !== void 0 ? _a : inject(Locale, navigator.language);
+    });
     // State
     const initialValueFrom = ref((_b = (_a = props.modelValue) === null || _a === void 0 ? void 0 : _a[0]) !== null && _b !== void 0 ? _b : getCurrentDate());
     const initialValueTo = ref((_d = (_c = props.modelValue) === null || _c === void 0 ? void 0 : _c[1]) !== null && _d !== void 0 ? _d : getNextMonthDate());
@@ -162,9 +178,6 @@ var script = defineComponent({
       return true;
     });
     // Methods
-    function switchSelectedControl() {
-      selectedControl.value = selectedControl.value === 'from' ? 'to' : 'from';
-    }
     function apply() {
       proxyModelValue.value = draftModelValue.value;
     }
@@ -172,6 +185,9 @@ var script = defineComponent({
       var _a;
       draftModelValue.value = (_a = proxyModelValue.value) !== null && _a !== void 0 ? _a : [undefined, undefined];
     }
+    function switchSelectedControl() {
+      selectedControl.value = selectedControl.value === 'from' ? 'to' : 'from';
+    }
     function openPopover(control) {
       if (!props.readonly && !props.disabled) {
         const popoverInstance = popover.value;
@@ -189,7 +205,7 @@ var script = defineComponent({
     }
     function formatDateAlt(value) {
       var _a;
-      return (_a = value === null || value === void 0 ? void 0 : value.toLocaleString(navigator.language, {
+      return (_a = value === null || value === void 0 ? void 0 : value.toLocaleString(resolvedLocale.value, {
         dateStyle: 'medium',
         timeZone: 'UTC'
       })) !== null && _a !== void 0 ? _a : '--';
@@ -201,12 +217,14 @@ var script = defineComponent({
     } = useResponsive();
     return {
       root,
+      rootStyles,
       inputBox,
       inputBoxRoot,
       popover,
       popoverState,
-      rootStyles,
       popoverStyles,
+      resolvedFormat,
+      resolvedLocale,
       initialValueFrom,
       initialValueTo,
       proxyModelValue,
@@ -216,9 +234,9 @@ var script = defineComponent({
       genericDraftModelValue,
       selectedControl,
       isInvalidDraftModelValue,
-      switchSelectedControl,
       apply,
       reset,
+      switchSelectedControl,
       openPopover,
       closePopover,
       formatDateAlt,
@@ -315,6 +333,8 @@ var __vue_render__ = function () {
       expression: "closePopover"
     }],
     attrs: {
+      "format": _vm.resolvedFormat,
+      "locale": _vm.resolvedLocale,
       "selected": _vm.popover && _vm.popover.state === 'open' && _vm.selectedControl === 'from',
       "required": _vm.required,
       "readonly": _vm.readonly,
@@ -342,6 +362,8 @@ var __vue_render__ = function () {
       expression: "closePopover"
     }],
     attrs: {
+      "format": _vm.resolvedFormat,
+      "locale": _vm.resolvedLocale,
       "selected": _vm.popover && _vm.popover.state === 'open' && _vm.selectedControl === 'to',
       "required": _vm.required,
       "readonly": _vm.readonly,
@@ -396,6 +418,9 @@ var __vue_render__ = function () {
   }, [_vm.isDesktop || _vm.isMobile && _vm.selectedControl === 'from' ? [_c('div', {
     class: ['layout-column', 'grow']
   }, [_c('OrDateTimePickerMonthSelect', {
+    attrs: {
+      "locale": _vm.resolvedLocale
+    },
     model: {
       value: _vm.initialValueFrom,
       callback: function ($$v) {
@@ -406,6 +431,8 @@ var __vue_render__ = function () {
   }), _vm._v(" "), _c('OrDateTimePickerDateSelect', {
     attrs: {
       "initial-value": _vm.initialValueFrom,
+      "format": _vm.resolvedFormat,
+      "locale": _vm.resolvedLocale,
       "range-start": _vm.draftModelValueFrom || _vm.initialValueFrom,
       "range-end": _vm.draftModelValueTo || _vm.initialValueTo
     },
@@ -424,6 +451,9 @@ var __vue_render__ = function () {
   })], 1)] : _vm._e(), _vm._v(" "), _vm.isDesktop || _vm.isMobile && _vm.selectedControl === 'to' ? [_c('div', {
     class: ['layout-column', 'grow']
   }, [_c('OrDateTimePickerMonthSelect', {
+    attrs: {
+      "locale": _vm.resolvedLocale
+    },
     model: {
       value: _vm.initialValueTo,
       callback: function ($$v) {
@@ -434,6 +464,8 @@ var __vue_render__ = function () {
   }), _vm._v(" "), _c('OrDateTimePickerDateSelect', {
     attrs: {
       "initial-value": _vm.initialValueTo,
+      "format": _vm.resolvedFormat,
+      "locale": _vm.resolvedLocale,
       "range-start": _vm.draftModelValueFrom || _vm.initialValueFrom,
       "range-end": _vm.draftModelValueTo || _vm.initialValueTo
     },

package/dist/esm/v2/{OrDateTimeFormat-80ff6397.js → OrDateTimeFormat-70e61dd6.js}

@@ -1,7 +1,7 @@
-import { defineComponent, ref, computed } from 'vue-demi';
-import './OrDateTimePicker.vue_rollup-plugin-vue_script-bd0836fd.js';
-import './OrDateTimePickerTimeSelect-2f7efc41.js';
-import { D as DateTimePickerTimeFormat, f as formatDate, a as formatTime } from './getTimePlaceholder-a1d75821.js';
+import { defineComponent, ref, computed, inject } from 'vue-demi';
+import { D as DateFormat, T as TimeFormat, L as Locale } from './OrDateTimePicker.vue_rollup-plugin-vue_script-b7ca34e8.js';
+import './OrDateTimePickerTimeSelect-3fa9a7c7.js';
+import { D as DateTimePickerDateFormat, a as DateTimePickerTimeFormat, f as formatDate, b as formatTime } from './getTimePlaceholder-9d18b5ac.js';
 import { n as normalizeComponent } from './normalize-component-6e8e3d80.js';
 
 const DateTimeFormat = [
@@ -16,12 +16,20 @@ var script = defineComponent({
   },
   props: {
     modelValue: {
-      type: Date,
+      type: undefined,
+      default: undefined
+    },
+    dateFormat: {
+      type: String,
       default: undefined
     },
     timeFormat: {
       type: String,
-      default: () => DateTimePickerTimeFormat.Auto
+      default: undefined
+    },
+    locale: {
+      type: String,
+      default: undefined
     },
     placeholder: {
       type: String,
@@ -29,14 +37,29 @@ var script = defineComponent({
     }
   },
   expose: ['root'],
-  setup() {
-    // Refs
+  setup(props) {
+    // Refs & Styles
     const root = ref();
-    // Styles
     const rootStyles = computed(() => ['or-date-time-format-v3', ...DateTimeFormat]);
+    // Options
+    const resolvedDateFormat = computed(() => {
+      var _a;
+      return (_a = props.dateFormat) !== null && _a !== void 0 ? _a : inject(DateFormat, DateTimePickerDateFormat.Short);
+    });
+    const resolvedTimeFormat = computed(() => {
+      var _a;
+      return (_a = props.timeFormat) !== null && _a !== void 0 ? _a : inject(TimeFormat, DateTimePickerTimeFormat.Auto);
+    });
+    const resolvedLocale = computed(() => {
+      var _a;
+      return (_a = props.locale) !== null && _a !== void 0 ? _a : inject(Locale, navigator.language);
+    });
     return {
       root,
       rootStyles,
+      resolvedDateFormat,
+      resolvedTimeFormat,
+      resolvedLocale,
       formatDate,
       formatTime
     };
@@ -54,7 +77,7 @@ var __vue_render__ = function () {
   return _c('div', {
     ref: 'root',
     class: _vm.rootStyles
-  }, [_vm._v("\n  " + _vm._s(_vm.modelValue ? _vm.formatDate(_vm.modelValue) + " " + _vm.formatTime(_vm.modelValue, _vm.timeFormat) : _vm.placeholder) + "\n")]);
+  }, [_vm.modelValue ? [_vm._v("\n    " + _vm._s(_vm.formatDate(_vm.modelValue, _vm.resolvedDateFormat, _vm.resolvedLocale) + " " + _vm.formatTime(_vm.modelValue, _vm.resolvedTimeFormat, _vm.resolvedLocale)) + "\n  ")] : [_vm._v("\n    " + _vm._s(_vm.placeholder) + "\n  ")]], 2);
 };
 var __vue_staticRenderFns__ = [];