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

package/dist/bundled/v2/components/OrDateTimePickerV3/OrDateTimePicker.js

@@ -1,9 +1,10 @@
-import { defineComponent, ref, computed, watch, toRef } from 'vue-demi';
-import { O as OrDateTimePickerDateControl, a as OrDateTimePickerDateSelect, b as OrDateTimePickerMonthSelect } from '../../OrDateTimePickerMonthSelect-980a9ada.js';
-import { O as OrDateTimePickerMobileControl, a as OrDateTimePickerPopoverFooter, b as OrDateTimePickerPopoverHeader } from '../../OrDateTimePickerPopoverHeader-a0ea3524.js';
-import { O as OrDateTimePickerTimeControl, a as OrDateTimePickerTimeSelect } from '../../OrDateTimePickerTimeSelect-328896c3.js';
-import { DateTimePickerTimeFormat } from './props.js';
+import { defineComponent, ref, computed, inject, watch, toRef } from 'vue-demi';
+import { O as OrDateTimePickerDateControl, a as OrDateTimePickerDateSelect, b as OrDateTimePickerMonthSelect } from '../../OrDateTimePickerMonthSelect-d0681d68.js';
+import { O as OrDateTimePickerMobileControl, a as OrDateTimePickerPopoverFooter, b as OrDateTimePickerPopoverHeader } from '../../OrDateTimePickerPopoverHeader-31d1e247.js';
+import { O as OrDateTimePickerTimeControl, a as OrDateTimePickerTimeSelect } from '../../OrDateTimePickerTimeSelect-bcdf865d.js';
 import { DateTimePicker, DateTimePickerDatePopover, DateTimePickerTimePopover } from './styles.js';
+import { DateFormat, TimeFormat, Locale } from './tokens.js';
+import { D as DateTimePickerDateFormat, a as DateTimePickerTimeFormat } from '../../types-6a847182.js';
 import __vue_component__$1 from '../OrErrorV3/OrError.js';
 import __vue_component__$2 from '../OrHintV3/OrHint.js';
 import __vue_component__$3 from '../OrIconV3/OrIcon.js';
@@ -47,12 +48,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
     },
     yearFilter: {
       type: Function,
@@ -111,8 +120,9 @@ var script = defineComponent({
   expose: ['root', 'focus', 'blur'],
   setup(props, context) {
     var _a;
-    // Refs
+    // Refs & Styles
     const root = ref();
+    const rootStyles = computed(() => ['or-date-time-picker-v3', ...DateTimePicker]);
     const inputBox = ref();
     const inputBoxRoot = computed(() => {
       var _a;
@@ -123,15 +133,26 @@ var script = defineComponent({
       var _a;
       return (_a = datePopover.value) === null || _a === void 0 ? void 0 : _a.state;
     });
+    const datePopoverStyles = computed(() => ['or-date-time-picker-date-popover-v3', ...DateTimePickerDatePopover]);
     const timePopover = ref();
     const timePopoverState = computed(() => {
       var _a;
       return (_a = timePopover.value) === null || _a === void 0 ? void 0 : _a.state;
     });
-    // Styles
-    const rootStyles = computed(() => ['or-date-time-picker-v3', ...DateTimePicker]);
-    const datePopoverStyles = computed(() => ['or-date-time-picker-date-popover-v3', ...DateTimePickerDatePopover]);
     const timePopoverStyles = computed(() => ['or-date-time-picker-time-popover-v3', ...DateTimePickerTimePopover]);
+    // 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);
+    });
     // State
     const initialValue = ref((_a = props.modelValue) !== null && _a !== void 0 ? _a : getCurrentDate());
     watch(() => props.modelValue, value => {
@@ -210,30 +231,33 @@ 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 : '--';
     }
     function formatTimeAlt(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, {
         timeStyle: 'short',
-        hourCycle: props.timeFormat !== DateTimePickerTimeFormat.Auto ? props.timeFormat : undefined,
+        hourCycle: resolvedTimeFormat.value !== DateTimePickerTimeFormat.Auto ? resolvedTimeFormat.value : undefined,
         timeZone: 'UTC'
       })) !== null && _a !== void 0 ? _a : '--';
     }
     return {
       root,
+      rootStyles,
       inputBox,
       inputBoxRoot,
       datePopover,
       datePopoverState,
+      datePopoverStyles,
       timePopover,
       timePopoverState,
-      rootStyles,
-      datePopoverStyles,
       timePopoverStyles,
+      resolvedDateFormat,
+      resolvedTimeFormat,
+      resolvedLocale,
       initialValue,
       proxyModelValue,
       draftModelValue,
@@ -333,6 +357,8 @@ var __vue_render__ = function () {
       expression: "closeDatePopover"
     }],
     attrs: {
+      "format": _vm.resolvedDateFormat,
+      "locale": _vm.resolvedLocale,
       "selected": _vm.datePopover && _vm.datePopover.state === 'open',
       "required": _vm.required,
       "readonly": _vm.readonly,
@@ -358,7 +384,8 @@ var __vue_render__ = function () {
       expression: "closeTimePopover"
     }],
     attrs: {
-      "format": _vm.timeFormat,
+      "format": _vm.resolvedTimeFormat,
+      "locale": _vm.resolvedLocale,
       "selected": _vm.timePopover && _vm.timePopover.state === 'open',
       "required": _vm.required,
       "readonly": _vm.readonly,
@@ -398,6 +425,7 @@ var __vue_render__ = function () {
     }
   }, [_vm._v("\n          " + _vm._s(_vm.formatTimeAlt(_vm.draftModelValue)) + "\n        ")])], 1), _vm._v(" "), _c('OrDateTimePickerMonthSelect', {
     attrs: {
+      "locale": _vm.resolvedLocale,
       "year-filter": _vm.yearFilter,
       "month-filter": _vm.monthFilter
     },
@@ -411,6 +439,8 @@ var __vue_render__ = function () {
   }), _vm._v(" "), _c('OrDateTimePickerDateSelect', {
     attrs: {
       "initial-value": _vm.initialValue,
+      "format": _vm.resolvedDateFormat,
+      "locale": _vm.resolvedLocale,
       "date-filter": _vm.dateFilter
     },
     model: {
@@ -462,7 +492,8 @@ var __vue_render__ = function () {
   }, [_vm._v("\n          " + _vm._s(_vm.formatTimeAlt(_vm.draftModelValue)) + "\n        ")])], 1), _vm._v(" "), _c('OrDateTimePickerTimeSelect', {
     attrs: {
       "initial-value": _vm.initialValue,
-      "format": _vm.timeFormat,
+      "format": _vm.resolvedTimeFormat,
+      "locale": _vm.resolvedLocale,
       "hours-filter": _vm.hoursFilter,
       "minutes-filter": _vm.minutesFilter
     },

package/dist/bundled/v2/components/OrDateTimePickerV3/OrDateTimePicker.vue.d.ts

@@ -1,9 +1,9 @@
 import { PropType } from 'vue-demi';
 import { InputBoxSize } from '../or-input-box-v3';
-import { DateTimePickerTimeFormat } from './props';
-import { FilterFunction } from './types';
+import { DateTimePickerFilterFunction, DateTimePickerModelValue } from './types';
 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[]>;
     inputBox: 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[], {} & {}, {
@@ -16,18 +16,20 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
         [x: number]: string;
     } | {}, true> | undefined>;
     datePopoverState: import("@vue/composition-api").ComputedRef<undefined>;
+    datePopoverStyles: import("@vue/composition-api").ComputedRef<string[]>;
     timePopover: 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>;
     timePopoverState: import("@vue/composition-api").ComputedRef<undefined>;
-    rootStyles: import("@vue/composition-api").ComputedRef<string[]>;
-    datePopoverStyles: import("@vue/composition-api").ComputedRef<string[]>;
     timePopoverStyles: import("@vue/composition-api").ComputedRef<string[]>;
+    resolvedDateFormat: import("@vue/composition-api").ComputedRef<"short" | "medium" | "long">;
+    resolvedTimeFormat: import("@vue/composition-api").ComputedRef<"auto" | "h12" | "h23">;
+    resolvedLocale: import("@vue/composition-api").ComputedRef<string>;
     initialValue: import("@vue/composition-api").Ref<Date>;
-    proxyModelValue: import("../../hooks").UseProxyModelValueReturn<Date>;
-    draftModelValue: import("@vue/composition-api").Ref<Date>;
+    proxyModelValue: import("../../hooks").UseProxyModelValueReturn<DateTimePickerModelValue>;
+    draftModelValue: import("@vue/composition-api").Ref<DateTimePickerModelValue>;
     isInvalidDraftModelValue: import("@vue/composition-api").ComputedRef<boolean>;
     apply: () => void;
     reset: () => void;
@@ -35,35 +37,43 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
     toggleTimePopover: () => void;
     closeDatePopover: () => void;
     closeTimePopover: () => void;
-    formatDateAlt: (value?: Date) => string;
-    formatTimeAlt: (value?: Date) => string;
+    formatDateAlt: (value: DateTimePickerModelValue) => string;
+    formatTimeAlt: (value: DateTimePickerModelValue) => string;
 }> & import("@vue/composition-api").Data, {}, {}, {
     modelValue: {
-        type: DateConstructor;
+        type: PropType<DateTimePickerModelValue>;
+        default: undefined;
+    };
+    dateFormat: {
+        type: PropType<"short" | "medium" | "long">;
         default: undefined;
     };
     timeFormat: {
         type: PropType<"auto" | "h12" | "h23">;
-        default: () => DateTimePickerTimeFormat.Auto;
+        default: undefined;
+    };
+    locale: {
+        type: StringConstructor;
+        default: undefined;
     };
     yearFilter: {
-        type: PropType<FilterFunction>;
+        type: PropType<DateTimePickerFilterFunction>;
         default: undefined;
     };
     monthFilter: {
-        type: PropType<FilterFunction>;
+        type: PropType<DateTimePickerFilterFunction>;
         default: undefined;
     };
     dateFilter: {
-        type: PropType<FilterFunction>;
+        type: PropType<DateTimePickerFilterFunction>;
         default: undefined;
     };
     hoursFilter: {
-        type: PropType<FilterFunction>;
+        type: PropType<DateTimePickerFilterFunction>;
         default: undefined;
     };
     minutesFilter: {
-        type: PropType<FilterFunction>;
+        type: PropType<DateTimePickerFilterFunction>;
         default: undefined;
     };
     size: {
@@ -100,31 +110,39 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
     };
 }, import("@vue/composition-api").ExtractPropTypes<{
     modelValue: {
-        type: DateConstructor;
+        type: PropType<DateTimePickerModelValue>;
+        default: undefined;
+    };
+    dateFormat: {
+        type: PropType<"short" | "medium" | "long">;
         default: undefined;
     };
     timeFormat: {
         type: PropType<"auto" | "h12" | "h23">;
-        default: () => DateTimePickerTimeFormat.Auto;
+        default: undefined;
+    };
+    locale: {
+        type: StringConstructor;
+        default: undefined;
     };
     yearFilter: {
-        type: PropType<FilterFunction>;
+        type: PropType<DateTimePickerFilterFunction>;
         default: undefined;
     };
     monthFilter: {
-        type: PropType<FilterFunction>;
+        type: PropType<DateTimePickerFilterFunction>;
         default: undefined;
     };
     dateFilter: {
-        type: PropType<FilterFunction>;
+        type: PropType<DateTimePickerFilterFunction>;
         default: undefined;
     };
     hoursFilter: {
-        type: PropType<FilterFunction>;
+        type: PropType<DateTimePickerFilterFunction>;
         default: undefined;
     };
     minutesFilter: {
-        type: PropType<FilterFunction>;
+        type: PropType<DateTimePickerFilterFunction>;
         default: undefined;
     };
     size: {
@@ -160,13 +178,15 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
         default: boolean;
     };
 }>> & Omit<import("vue").VueConstructor<import("vue").default>, never> & (new (...args: any[]) => import("@vue/composition-api").ComponentRenderProxy<{
-    modelValue: Date;
+    modelValue: DateTimePickerModelValue;
+    dateFormat: "short" | "medium" | "long";
     timeFormat: "auto" | "h12" | "h23";
-    yearFilter: FilterFunction;
-    monthFilter: FilterFunction;
-    dateFilter: FilterFunction;
-    hoursFilter: FilterFunction;
-    minutesFilter: FilterFunction;
+    locale: string;
+    yearFilter: DateTimePickerFilterFunction;
+    monthFilter: DateTimePickerFilterFunction;
+    dateFilter: DateTimePickerFilterFunction;
+    hoursFilter: DateTimePickerFilterFunction;
+    minutesFilter: DateTimePickerFilterFunction;
     size: "m" | "s";
     label: string;
     hint: string;
@@ -179,6 +199,7 @@ 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>;
+    rootStyles: import("@vue/composition-api").ComputedRef<string[]>;
     inputBox: 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[], {} & {}, {
@@ -191,18 +212,20 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
         [x: number]: string;
     } | {}, true> | undefined>;
     datePopoverState: import("@vue/composition-api").ComputedRef<undefined>;
+    datePopoverStyles: import("@vue/composition-api").ComputedRef<string[]>;
     timePopover: 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>;
     timePopoverState: import("@vue/composition-api").ComputedRef<undefined>;
-    rootStyles: import("@vue/composition-api").ComputedRef<string[]>;
-    datePopoverStyles: import("@vue/composition-api").ComputedRef<string[]>;
     timePopoverStyles: import("@vue/composition-api").ComputedRef<string[]>;
+    resolvedDateFormat: import("@vue/composition-api").ComputedRef<"short" | "medium" | "long">;
+    resolvedTimeFormat: import("@vue/composition-api").ComputedRef<"auto" | "h12" | "h23">;
+    resolvedLocale: import("@vue/composition-api").ComputedRef<string>;
     initialValue: import("@vue/composition-api").Ref<Date>;
-    proxyModelValue: import("../../hooks").UseProxyModelValueReturn<Date>;
-    draftModelValue: import("@vue/composition-api").Ref<Date>;
+    proxyModelValue: import("../../hooks").UseProxyModelValueReturn<DateTimePickerModelValue>;
+    draftModelValue: import("@vue/composition-api").Ref<DateTimePickerModelValue>;
     isInvalidDraftModelValue: import("@vue/composition-api").ComputedRef<boolean>;
     apply: () => void;
     reset: () => void;
@@ -210,16 +233,18 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
     toggleTimePopover: () => void;
     closeDatePopover: () => void;
     closeTimePopover: () => void;
-    formatDateAlt: (value?: Date) => string;
-    formatTimeAlt: (value?: Date) => string;
+    formatDateAlt: (value: DateTimePickerModelValue) => string;
+    formatTimeAlt: (value: DateTimePickerModelValue) => string;
 }>, import("@vue/composition-api").Data, {}, {}, {}, {}, string[], {
-    modelValue: Date;
+    modelValue: DateTimePickerModelValue;
+    dateFormat: "short" | "medium" | "long";
     timeFormat: "auto" | "h12" | "h23";
-    yearFilter: FilterFunction;
-    monthFilter: FilterFunction;
-    dateFilter: FilterFunction;
-    hoursFilter: FilterFunction;
-    minutesFilter: FilterFunction;
+    locale: string;
+    yearFilter: DateTimePickerFilterFunction;
+    monthFilter: DateTimePickerFilterFunction;
+    dateFilter: DateTimePickerFilterFunction;
+    hoursFilter: DateTimePickerFilterFunction;
+    minutesFilter: DateTimePickerFilterFunction;
     size: "m" | "s";
     label: string;
     hint: string;
@@ -231,13 +256,15 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
 } & {} & {
     [x: `on${Capitalize<string>}`]: ((...args: any[]) => any) | undefined;
 }, {
-    modelValue: Date;
+    modelValue: DateTimePickerModelValue;
+    dateFormat: "short" | "medium" | "long";
     timeFormat: "auto" | "h12" | "h23";
-    yearFilter: FilterFunction;
-    monthFilter: FilterFunction;
-    dateFilter: FilterFunction;
-    hoursFilter: FilterFunction;
-    minutesFilter: FilterFunction;
+    locale: string;
+    yearFilter: DateTimePickerFilterFunction;
+    monthFilter: DateTimePickerFilterFunction;
+    dateFilter: DateTimePickerFilterFunction;
+    hoursFilter: DateTimePickerFilterFunction;
+    minutesFilter: DateTimePickerFilterFunction;
     size: "m" | "s";
     label: string;
     hint: string;

package/dist/bundled/v2/components/OrDateTimePickerV3/index.d.ts

@@ -1,5 +1,5 @@
 export { default as OrDateTimePickerV3 } from './OrDateTimePicker.vue';
 export * from './partials';
-export * from './props';
+export * from './tokens';
 export * from './types';
 export * from './utils';

package/dist/bundled/v2/components/OrDateTimePickerV3/index.js

@@ -1,8 +1,9 @@
 export { default as OrDateTimePickerV3 } from './OrDateTimePicker.js';
-export { O as OrDateTimePickerDateControl, a as OrDateTimePickerDateSelect, b as OrDateTimePickerMonthSelect } from '../../OrDateTimePickerMonthSelect-980a9ada.js';
-export { O as OrDateTimePickerMobileControl, a as OrDateTimePickerPopoverFooter, b as OrDateTimePickerPopoverHeader } from '../../OrDateTimePickerPopoverHeader-a0ea3524.js';
-export { O as OrDateTimePickerTimeControl, a as OrDateTimePickerTimeSelect } from '../../OrDateTimePickerTimeSelect-328896c3.js';
-export { DateTimePickerTimeFormat } from './props.js';
+export { O as OrDateTimePickerDateControl, a as OrDateTimePickerDateSelect, b as OrDateTimePickerMonthSelect } from '../../OrDateTimePickerMonthSelect-d0681d68.js';
+export { O as OrDateTimePickerMobileControl, a as OrDateTimePickerPopoverFooter, b as OrDateTimePickerPopoverHeader } from '../../OrDateTimePickerPopoverHeader-31d1e247.js';
+export { O as OrDateTimePickerTimeControl, a as OrDateTimePickerTimeSelect } from '../../OrDateTimePickerTimeSelect-bcdf865d.js';
+export { DateFormat, Locale, TimeFormat } from './tokens.js';
+export { D as DateTimePickerDateFormat, a as DateTimePickerTimeFormat } from '../../types-6a847182.js';
 export { formatDate } from './utils/formatDate.js';
 export { formatTime } from './utils/formatTime.js';
 export { getCurrentDate } from './utils/getCurrentDate.js';

package/dist/bundled/v2/components/OrDateTimePickerV3/tokens.d.ts

@@ -0,0 +1,3 @@
+export declare const DateFormat: unique symbol;
+export declare const TimeFormat: unique symbol;
+export declare const Locale: unique symbol;

package/dist/bundled/v2/components/OrDateTimePickerV3/tokens.js

@@ -0,0 +1,5 @@
+const DateFormat = Symbol();
+const TimeFormat = Symbol();
+const Locale = Symbol();
+
+export { DateFormat, Locale, TimeFormat };

package/dist/bundled/v2/components/OrDateTimePickerV3/types.d.ts

@@ -1,3 +1,14 @@
-export interface FilterFunction {
+export type DateTimePickerModelValue = Date | null | undefined;
+export declare enum DateTimePickerDateFormat {
+    Short = "short",
+    Medium = "medium",
+    Long = "long"
+}
+export declare enum DateTimePickerTimeFormat {
+    Auto = "auto",
+    H12 = "h12",
+    H23 = "h23"
+}
+export interface DateTimePickerFilterFunction {
     (value: Date): boolean;
 }

package/dist/bundled/v2/components/OrDateTimePickerV3/utils/formatDate.d.ts

@@ -1 +1,2 @@
-export declare function formatDate(value: Date): string;
+import { DateTimePickerDateFormat } from '../types';
+export declare function formatDate(value: Date, format: `${DateTimePickerDateFormat}`, locale: string): string;

package/dist/bundled/v2/components/OrDateTimePickerV3/utils/formatDate.js

@@ -1,6 +1,6 @@
-function formatDate(value) {
-  return value.toLocaleString(navigator.language, {
-    dateStyle: 'short',
+function formatDate(value, format, locale) {
+  return value.toLocaleString(locale, {
+    dateStyle: format,
     timeZone: 'UTC'
   });
 }

package/dist/bundled/v2/components/OrDateTimePickerV3/utils/formatTime.d.ts

@@ -1,2 +1,2 @@
-import { DateTimePickerTimeFormat } from '../props';
-export declare function formatTime(value: Date, format?: `${DateTimePickerTimeFormat}`): string;
+import { DateTimePickerTimeFormat } from '../types';
+export declare function formatTime(value: Date, format: `${DateTimePickerTimeFormat}`, locale: string): string;

package/dist/bundled/v2/components/OrDateTimePickerV3/utils/formatTime.js

@@ -1,7 +1,7 @@
-import { DateTimePickerTimeFormat } from '../props.js';
+import { a as DateTimePickerTimeFormat } from '../../../types-6a847182.js';
 
-function formatTime(value, format) {
-  return value.toLocaleString(navigator.language, {
+function formatTime(value, format, locale) {
+  return value.toLocaleString(locale, {
     timeStyle: 'short',
     hourCycle: format !== DateTimePickerTimeFormat.Auto ? format : undefined,
     timeZone: 'UTC'

package/dist/bundled/v2/components/OrDateTimePickerV3/utils/getDatePlaceholder.d.ts

@@ -1 +1,2 @@
-export declare function getDatePlaceholder(): string;
+import { DateTimePickerDateFormat } from '../types';
+export declare function getDatePlaceholder(format: `${DateTimePickerDateFormat}`, locale: string): string;

package/dist/bundled/v2/components/OrDateTimePickerV3/utils/getDatePlaceholder.js

@@ -1,9 +1,29 @@
-function getDatePlaceholder() {
-  const sample = new Date(Date.UTC(1111, 1, 3, 4, 5)).toLocaleString(navigator.language, {
-    dateStyle: 'short',
+function getDatePlaceholder(format, locale) {
+  const formatter = new Intl.DateTimeFormat(locale, {
+    dateStyle: format,
     timeZone: 'UTC'
   });
-  return sample.replace(/1/g, 'Y').replace(/02/, 'MM').replace(/2/, 'M').replace(/03/g, 'DD').replace(/3/, 'D');
+  return formatter.formatToParts(Date.UTC(0, 0)).reduce((accumulator, part) => {
+    switch (part.type) {
+      case 'year':
+        return accumulator + part.value.replace(/^\d{2}$/, 'YY').replace(/^\d{4}$/, 'YYYY');
+      case 'month':
+        switch (format) {
+          case 'short':
+            return accumulator + part.value.replace(/^\d{1}$/, 'M').replace(/^\d{2}$/, 'MM');
+          case 'medium':
+            return accumulator + 'MMM';
+          case 'long':
+            return accumulator + 'MMMM';
+          default:
+            throw new Error();
+        }
+      case 'day':
+        return accumulator + part.value.replace(/^\d{1}$/, 'D').replace(/^\d{2}$/, 'DD');
+      default:
+        return accumulator + part.value;
+    }
+  }, '');
 }
 
 export { getDatePlaceholder };

package/dist/bundled/v2/components/OrDateTimePickerV3/utils/getTimePlaceholder.d.ts

@@ -1,2 +1,2 @@
-import { DateTimePickerTimeFormat } from '../props';
-export declare function getTimePlaceholder(format?: `${DateTimePickerTimeFormat}`): string;
+import { DateTimePickerTimeFormat } from '../types';
+export declare function getTimePlaceholder(format: `${DateTimePickerTimeFormat}`, locale: string): string;

package/dist/bundled/v2/components/OrDateTimePickerV3/utils/getTimePlaceholder.js

@@ -1,12 +1,23 @@
-import { DateTimePickerTimeFormat } from '../props.js';
+import { a as DateTimePickerTimeFormat } from '../../../types-6a847182.js';
 
-function getTimePlaceholder(format) {
-  const sample = new Date(Date.UTC(1, 1, 3, 4, 5)).toLocaleString(navigator.language, {
+function getTimePlaceholder(format, locale) {
+  const formatter = new Intl.DateTimeFormat(locale, {
     timeStyle: 'short',
     hourCycle: format !== DateTimePickerTimeFormat.Auto ? format : undefined,
     timeZone: 'UTC'
   });
-  return sample.replace(/04/, 'HH').replace(/4/, 'H').replace(/05/, 'MM').replace(/5/, 'M').replace(/AM|PM/, 'A');
+  return formatter.formatToParts(Date.UTC(0, 0)).reduce((accumulator, part) => {
+    switch (part.type) {
+      case 'hour':
+        return accumulator + part.value.replace(/^\d{1}$/, 'H').replace(/^\d{2}$/, 'HH');
+      case 'minute':
+        return accumulator + part.value.replace(/^\d{1}$/, 'M').replace(/^\d{2}$/, 'MM');
+      case 'dayPeriod':
+        return accumulator + 'A';
+      default:
+        return accumulator + part.value;
+    }
+  }, '');
 }
 
 export { getTimePlaceholder };

package/dist/bundled/v2/components/OrInputV3/OrInput.js

@@ -1,2 +1,2 @@
-export { _ as default } from '../../OrInput-aeca8c1a.js';
+export { _ as default } from '../../OrInput-5cef921b.js';
 import '../../normalize-component-6e8e3d80.js';

package/dist/bundled/v2/components/OrInputV3/index.js

@@ -1 +1 @@
-export { I as InputType, _ as OrInputV3 } from '../../OrInput-aeca8c1a.js';
+export { I as InputType, _ as OrInputV3 } from '../../OrInput-5cef921b.js';

package/dist/bundled/v2/components/OrLabelV3/styles.js

@@ -25,10 +25,10 @@ const LabelVariants = {
   'theme-foreground-default', 'dark:theme-foreground-default-dark']
 };
 const LabelText = [
-// Content (required)
-'required:after:content-["*"]',
 // Interactivity
-'interactivity-default'];
+'interactivity-default',
+// Content (required)
+'required:after:content-["*"]'];
 const LabelAddon = [
 // Layout
 'layout-inline-row empty:hidden',

package/dist/bundled/v2/components/OrListV3/OrList.js

@@ -1,2 +1,2 @@
-export { _ as default } from '../../OrList-1cda0d88.js';
+export { _ as default } from '../../OrList-ee849918.js';
 import '../../normalize-component-6e8e3d80.js';

package/dist/bundled/v2/components/OrListV3/index.js

@@ -1 +1 @@
-export { O as OrListItem, _ as OrListV3 } from '../../OrList-1cda0d88.js';
+export { O as OrListItem, _ as OrListV3 } from '../../OrList-ee849918.js';

package/dist/bundled/v2/components/OrRichTextEditorV3/OrRichTextEditor.js

@@ -12,7 +12,7 @@ import __vue_component__$2 from '../OrLabelV3/OrLabel.js';
 import __vue_component__$3 from '../OrMenuItemV3/OrMenuItem.js';
 import __vue_component__$4 from '../OrMenuV3/OrMenu.js';
 import __vue_component__$5 from '../OrModalV3/OrModal.js';
-import { _ as __vue_component__$6 } from '../../OrInput-aeca8c1a.js';
+import { _ as __vue_component__$6 } from '../../OrInput-5cef921b.js';
 import __vue_component__$7 from '../OrButtonV3/OrButton.js';
 import __vue_component__$8 from '../OrPopoverV3/OrPopover.js';
 import __vue_component__$9 from '../OrHintV3/OrHint.js';

package/dist/bundled/v2/components/OrSearchV3/OrSearch.js

@@ -1,5 +1,5 @@
 import { defineComponent, ref, computed, reactive, toRef, watch } from 'vue-demi';
-import { _ as __vue_component__$1 } from '../../OrInput-aeca8c1a.js';
+import { _ as __vue_component__$1 } from '../../OrInput-5cef921b.js';
 import { b as watchDebounced } from '../../index-279e78b9.js';
 import { InputBoxSize } from '../OrInputBoxV3/props.js';
 import { useIdAttribute } from '../../hooks/useIdAttribute.js';

package/dist/bundled/v2/components/OrSelectV3/OrSelect.js

@@ -14,7 +14,7 @@ import __vue_component__$8 from '../OrExpansionPanelV3/OrExpansionPanel.js';
 import __vue_component__$9 from '../OrHintV3/OrHint.js';
 import __vue_component__$a from '../OrIconV3/OrIcon.js';
 import __vue_component__$b from '../OrIconButtonV3/OrIconButton.js';
-import { _ as __vue_component__$c } from '../../OrInput-aeca8c1a.js';
+import { _ as __vue_component__$c } from '../../OrInput-5cef921b.js';
 import __vue_component__$d from '../OrInputBoxV3/OrInputBox.js';
 import __vue_component__$e from '../OrLabelV3/OrLabel.js';
 import __vue_component__$f from '../OrMenuItemV3/OrMenuItem.js';